stroke Object

Defines the stroke configuration.

Example - customizing the shape border

<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",
    stroke: {
      color: "#8800cc",
      dashType: "dashDot"
    }
  });
  diagram.addShape(shape);
</script>

stroke.color String

Defines the color of the shape's stroke.

stroke.width Number (default: 1)

Defines the thickness or width of the shape's stroke.

stroke.dashType String

The dash type of the shape.

The following dash types are supported:

  • "dash" - a line consisting of dashes
  • "dashDot" - a line consisting of a repeating pattern of dash-dot
  • "dot" - a line consisting of dots
  • "longDash" - a line consisting of a repeating pattern of long-dash
  • "longDashDot" - a line consisting of a repeating pattern of long-dash-dot
  • "longDashDotDot" - a line consisting of a repeating pattern of long-dash-dot-dot
  • "solid" - a solid line
In this article
Not finding the help you need? Improve this article