stroke Object

Defines the stroke configuration.

    <div id="diagram"></div>

      var Shape = kendo.dataviz.diagram.Shape;
      $("#diagram").kendoDiagram();
      var diagram = $("#diagram").data("kendoDiagram");
      var shape1 = diagram.addShape( new Shape({x:100, y: 100}));
      var shape2 = diagram.addShape( new Shape({x:300, y: 100}));


      var connection = new kendo.dataviz.diagram.Connection(shape1, shape2, {
        stroke: {
          color: "red",
          width: 2,
          dashType: "dash"
        },
        selectable: false
      });

      diagram.addConnection(connection);
    </script>

stroke.color String

Defines the stroke or line color of the connection.

stroke.dashType String

Specifies the stroke dash type.

The following dash types are supported:

  • "dash" - A line that consists of dashes
  • "dashDot" - A line that consists of a repeating pattern of dash-dot
  • "dot" - A line that consists of dots
  • "longDash" - A line that consists of a repeating pattern of long-dash
  • "longDashDot" - A line that consists of a repeating pattern of long-dash-dot
  • "longDashDotDot" - A line that consists of a repeating pattern of long-dash-dot-dot
  • "solid" - A solid line

stroke.width Number

Defines the stroke width of the connection.

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