Search code examples
javascriptedgescardinalityvis.js

How to change arrows in vis.js to chicken feet or cardinality

I am trying to use vis.js to show the structure of an XML or JSON Schema. I would like to show cardinality instead of an arrow.

Any suggestions on documentation to view, because I cannot find any.

Thanks, Loren

Solution

  • Each edge has a function that is responsible for drawing arrows: drawArrows. Accordingly, it is possible to redefine its:

    edge.drawArrows = function drawArrows(ctx, arrowData) {
    if (this.options.arrows.from.enabled === true) {
      drawArrowCircle(ctx, this.selected, this.hover, arrowData.from);
    }
    if (this.options.arrows.middle.enabled === true) {
      drawArrowDiamond(ctx, this.selected, this.hover, arrowData.middle);
    }
    if (this.options.arrows.to.enabled === true) {
      this.edgeType.drawArrowHead(ctx, this.selected, this.hover, arrowData.to);
    }
  }

    https://jsfiddle.net/ct34zwn6/