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

Redraw

methods

Renders the shape with the given options. It redefines the options and redraws the shape accordingly.

redraw

Parameters:optionsObject

The object containing a subset of options to change. Follows the same structure as the configuration.

<div id="diagram"></div>
<script>
$("#diagram").kendoDiagram({
    shapes: [{
        id: "1",
        content: {
            text: "Original Shape"
        },
        fill: {
            color: "blue"
        }
    }],
    dataBound: function(e) {
      setTimeout(function () {
             var shape = e.sender.shapes[0];
             // Redraw shape with new options
             shape.redraw({
                 fill: {
                     color: "red"
                 },
                 content: {
                     text: "Redrawn Shape"
                 }
             });
      }, 2000);
    }
});
</script>

Example - Redraw shape with new options

<div id="diagram"></div>
<script>
    $("#diagram").kendoDiagram({
      dataSource: {
          data: [{ "items": [{ items: [{}] }] }],
          schema: { model: { children: "items" } }
      },
      layout: {
          type: "tree"
      },
      dataBound: function(e) {
          e.sender.shapes[0].redraw({
              fill: {
                  color: "green"
              }
          });
      }
    });
</script>