connectors Array

Defines the connectors the shape owns.

Example - customizing the shape connectors

<div id="diagram"></div>
<script>
  var Shape = kendo.dataviz.diagram.Shape;
  $("#diagram").kendoDiagram();
  var diagram = $("#diagram").data("kendoDiagram");

  var shape = new Shape({
    id: 1,
    x: 20,
    y: 20,
    fill: "#c0f0fc",
    connectors: [
      {
        name: "top"
      },
      {
        name: "Upstream",
        position: function(shp) {
          return shp._transformPoint(shp.bounds().bottomRight());
        }
      }]
  });
  diagram.addShape(shape);
</script>

connectors.name String

The connector name. Predefined names include:

  • "top" - top connector.
  • "right" - right connector.
  • "bottom" - bottom connector.
  • "bottomRight" - bottom right connector.
  • "left" - left connector.
  • "auto" - auto connector.

connectors.position Function

The function that positions the connector.

In this article
Not finding the help you need? Improve this article