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

Width

configuration

The width of the surface element. By default the surface will expand to fill the width of the first positioned container.

width

String

Default: "100%"

<div id="container" style="width: 500px; border: 1px solid #ccc;"></div>
<script>
    var draw = kendo.drawing;
    var geom = kendo.geometry;
    var surface = draw.Surface.create($("#container"), {
        width: "450px",
        height: "200px"
    });

    var circle = new draw.Circle(new geom.Circle([150, 80], 60))
        .fill("orange");

    surface.draw(circle);
</script>