Share JSXGraph: example "Parallelogram"

JSXGraph
Share JSXGraph: example "Parallelogram"
This website is a beta version. The official release will be in **2023**.

Parallelogram

// Define the id of your board in BOARDID

JXG.Options.label.autoPosition = true;
JXG.Options.text.useMathJax = true;
JXG.Options.text.fontSize = 20;

const board = JXG.JSXGraph.initBoard(BOARDID, {
    boundingbox: [-5, 5, 5, -5],
    showNavigation: false,
    keepaspectratio: true
});

let p = board.create('point', [-3, -3], {name: '\\(p\\)'});
let q = board.create('point', [2, -3], {name: '\\(q\\)'});
let s = board.create('point', [-1, 1], {name: '\\(s\\)'});
let r = board.create('parallelpoint', [p, q, s], {name: '\\(r\\)', color: 'blue'});

let pq = board.create('arrow', [p, q], {
    withLabel: true,
    name: '\\(\\vec{pq}\\)',
    label: {position: 'top', parse: false},
    lastArrow: {type: 4, size: 8}
});
let sr = board.create('arrow', [s, r], {
    withLabel: true,
    name: '\\(\\vec{sr}\\)',
    label: {position: 'top', parse: false},
    lastArrow: {type: 4, size: 8}
});
let ps = board.create('arrow', [p, s], {
    withLabel: true,
    name: '\\(\\vec{ps}\\)',
    label: {position: 'top'},
    lastArrow: {type: 4, size: 8}
});
let qr = board.create('arrow', [q, r], {
    withLabel: true,
    name: '\\(\\vec{qr}\\)',
    label: {position: 'top'},
    lastArrow: {type: 4, size: 8}
});

let pr = board.create('arrow', [p, r], {});