Example: Arrows extension

Example code

import {ARROW_TYPE, Arrows} from "../../src/cm-chessboard/extensions/arrows/Arrows.js"
import {Chessboard} from "../../src/cm-chessboard/Chessboard.js"

const chessboard = new Chessboard(document.getElementById("board"), {
    position: "rn2k1r1/ppp1pp1p/3p2p1/5bn1/P7/2N2B2/1PPPPP2/2BNK1RR w Gkq - 4 11",
    sprite: {url: "../../assets/images/chessboard-sprite.svg"},
            class: Arrows,
            props: {
                sprite: {
                    url: "../../src/cm-chessboard/extensions/arrows/assets/arrows.svg"

chessboard.addArrow(ARROW_TYPE.default, "f3", "d5");
chessboard.addArrow(ARROW_TYPE.default, "b8", "c6");
chessboard.addArrow(ARROW_TYPE.pointy, "d2", "d3");
chessboard.addArrow(ARROW_TYPE.danger, "g5", "e6");


addArrow(type, from, to)

removeArrows(type, from, to)

To remove all arrows, call chessboard.removeArrows() without parameters. To remove all arrows of a specific type (type "danger"), call chessboard.removeArrows(ARROW_TYPE.danger). To remove all arrows starting at "e2" you can call chessboard.removeArrows(undefined, "e2") and so on...

getArrows(type, from, to)

To get all arrows, call chessboard.getArrows() without parameters, as with removeArrows(type, from, to).