boundingBox

Returns

kendo.dataviz.diagram.Rect The bounding rectangle of the specified items. If nothing is specified the bounding box of the all diagram will be returned.

Parameters

items Array

The items (shapes and connections) to include in the bounding box. Defaults to all items if not specified.

Example - getting the bounding box of given shapes

<button id="btn">Get bounding box of 1st and 2nd shape</button>
<div id="diagram"></div>
<script>
  $("#diagram").kendoDiagram({
    shapes: [{
      id: "1",
      content: {
        text: "Monday"
      },
      x: 100,
      y: 20
    }, {
      id: "2",
      content: {
        text: "Tuesday"
      },
      x: 350,
      y: 20
    }, {
      id: "3",
      content: {
        text: "Wednesday"
      },
      x: 250,
      y: 200
    }],
    connections: [{
      from: "1",
      to: "2"
    },{
      from: "2",
      to: "3"
    }],
    connectionDefaults: {
      endCap: "ArrowEnd"
    }
  });

  $("#btn").on("click", function(){
    var diagram = $("#diagram").getKendoDiagram();
    var shapes = diagram.shapes;
/* The result can be observed in the DevTools(F12) console of the browser. */
    console.log(diagram.boundingBox([shapes[0], shapes[1]]));
  });
</script>
In this article