Share JSXGraph: example "Video embedding"

JSXGraph
Share JSXGraph: example "Video embedding"
This website is a beta version. The official release will be in **2024**.

Video embedding

Videos can be embedded as `foreignobject` and placed in an arbitrary layer. That means, objects can be placed "above" the video, too.
<style>
   .JXGtext {
        background-color: rgba(255, 255, 255, 0.6);
        padding: 5px;
        border-radius: 5px;
    }
</style>
// Define the id of your board in BOARDID

var board = JXG.JSXGraph.initBoard(BOARDID, {
    boundingbox: [-6, 4, 6, -4],
    axis: false,
    grid: false,
    showNavigation: false,
    showCopyright: false,
    zoom: {
        enabled: false,
        wheel: false
    },
    pan: {
        enabled: false,
        needTwoFingers: false
    }
});;

board.options.point.showInfobox = false;
board.options.elements.highlight = false;

var points = [],
    t0x = -2, t0y = 3.5,
    t1x = 0, t1y = 3.5,
    t2x = 2, t2y = 3.5;

points.push(board.create('point', [-2, 3.5], {
    fixed: false,
    color: 'yellow',
    size: 6,
    name: '6 am'
}));
points.push(board.create('point', [0, 3.5], {
    fixed: false,
    color: 'yellow',
    size: 6,
    name: '12 pm'
}));
points.push(board.create('point', [2, 3.5], {
    fixed: false,
    color: 'yellow',
    size: 6,
    name: '6 pm'
}));

var fo = board.create('fo', [
    '