change

Fired when an item is added or removed to/from the diagram.

Event Data

e.added Array

The added items (shapes or connections).

e.removed Array

The removed items (shapes or connections).

e.sender kendo.dataviz.ui.Diagram

The widget instance which fired the event.

Example - get added and removed items

<div id="diagram"></div>
<script>
  function onChange(e){
/* The result can be observed in the DevTools(F12) console of the browser. */
    console.log("Added items: " + e.added.length + "; Removed items: " + e.removed.length);
  }

  $("#diagram").kendoDiagram({
    shapes:[
      {
        id:"1",
        content:{
          text: "State 1"
        },
        x: 20,
        y: 20
      },
      {
        id:"2",
        content: {
          text: "State 2"
        },
        x: 160,
        y: 20
      }
    ],
    connections:[
      {
        from: "1",
        to: "2"
      }
    ],
    change: onChange
  });
</script>
In this article