connections.endCap String|Object
The connection end cap configuration or type name.
Example - configuring the connection end cap
<div id="diagram"></div>
<script>
$("#diagram").kendoDiagram({
shapes: [{
id: "1",
content: {
text: "Monday"
}
}, {
id: "2",
x: 200,
content: {
text: "Tuesday"
}
}],
connections: [{
from: "1",
to: "2",
endCap: {
type: "FilledCircle",
fill: {
color: "red"
},
stroke: {
color: "blue",
width: 2
}
}
}]
});
</script>
connections.endCap.fill String|Object
The connection end cap fill options or color.
connections.endCap.fill.color String
(default: "black")
The connection end cap fill color.
connections.endCap.fill.opacity
The connection end cap fill opacity.
connections.endCap.stroke String|Object
The connection end cap stroke options or color.
connections.endCap.stroke.color String
The connection end cap stroke color.
connections.endCap.stroke.dashType String
The connection 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
connections.endCap.stroke.width Number
The connection end cap stroke width.
connections.endCap.type String
(default: "none")
The connection end cap type.
The supported values are:
- "none": no cap
- "ArrowEnd": a filled arrow
- "FilledCircle": a filled circle
You can also use "ArrowStart" for the endCap but its direction will be inversed.