New to Kendo UI for jQuery? Start a free 30-day trial

Stroke

configuration

Defines the stroke configuration.

stroke

Object

<div id="diagram"></div>
<script>
$("#diagram").kendoDiagram({
    shapes: [{
        type: "rectangle",
        x: 100,
        y: 100,
        width: 200,
        height: 100,
        fill: {
            color: "#ff6358"
        },
        stroke: {
            color: "#0099ff",
            width: 3
        }
    }]
});
</script>

stroke.color

String

Defines the line color of the rectangle.

<div id="diagram"></div>
<script>
$("#diagram").kendoDiagram({
    shapes: [{
        type: "rectangle",
        x: 100,
        y: 100,
        width: 200,
        height: 100,
        fill: {
            color: "#ff6358"
        },
        stroke: {
            color: "#28b4c8"
        }
    }]
});
</script>

stroke.width

Number

Defines the stroke width of the rectangle.

<div id="diagram"></div>
<script>
$("#diagram").kendoDiagram({
    shapes: [{
        type: "rectangle",
        x: 100,
        y: 100,
        width: 200,
        height: 100,
        fill: {
            color: "#ff6358"
        },
        stroke: {
            color: "#0099ff",
            width: 5
        }
    }]
});
</script>