connectionDefaults.endCapString|Object

The connections end cap configuration. Can be set to a configuration object or a string that represents the endCap.type value.

Example - configuring the connection end cap

<div id="diagram"></div>
<script>
  $("#diagram").kendoDiagram({
    shapes:[
      {
        id:"1",
        content:{
          text: "State 1"
        },
        x: 20,
        y: 20
      },
      {
        id:"2",
        content: {
          text: "State 2"
        },
        x: 200,
        y: 20
      }
    ],
    connections:[
      {
        from: "1",
        to: "2"
      }
    ],
    connectionDefaults: {
      endCap: {
        type: "FilledCircle",
        fill: {
          color: "red"
        },
        stroke: {
          color: "blue",
          width: 2
        }
      }
    }
  });
</script>

connectionDefaults.endCap.fillString|Object

The connections end cap fill options or color.

connectionDefaults.endCap.fill.colorString(default: "black")

The connections end cap fill color.

connectionDefaults.endCap.fill.opacity

The connections end cap fill opacity.

connectionDefaults.endCap.strokeString|Object

The connections end cap stroke options or color.

connectionDefaults.endCap.stroke.colorString

The connections end cap stroke color.

connectionDefaults.endCap.stroke.dashTypeString

The connections end cap 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

connectionDefaults.endCap.stroke.widthNumber

The connections end cap stroke width.

connectionDefaults.endCap.typeString(default: "none")

The end cap type used in connections.

The supported values are:

  • "none": no cap
  • "ArrowEnd": a filled arrow
  • "FilledCircle": a filled circle