Save

<div id="diagram" style="height:600px;"></div>
<script>
  $("#diagram").kendoDiagram({
    dataSource: {
      data: [
        { id: 1, jobTitle: "President" },
        { id: 2, jobTitle: "VP Finance" }
      ],
      schema: {
        model: {
          id: "id",
          fields: {
            jobTitle: { type: "string" }
          }
        }
      }
    },
    connectionsDataSource: {
      data: [
        { id: 1, from: 1, to: 2 }
      ],
      schema: {
        model: {
          id: "id",
          fields: {
            from: { type: "number" },
            to: { type: "number" }
          }
        }
      }
    },
    layout: {
      type: "tree",
      subtype: "tipover",
      underneathHorizontalOffset: 140
    },
    shapeDefaults: {
      content: {
        template: "#: jobTitle #"
      }
    },
    save: onSave
  });

  function onSave(e){
    if(e.shape){
/* The result can be observed in the DevTools(F12) console of the browser. */
      console.log("Saved shape with id: " + e.shape.id);
    }
    if(e.connection){
/* The result can be observed in the DevTools(F12) console of the browser. */
      console.log("Saved connection with id: " + e.connection.id);
    }
  }
</script>