toBack

Sends the specified items to the back, i.e. it's reordering items to ensure they are underneath the complementary items.

Parameters

items Array

An array of diagram items.

undoable Boolean

Whether the change should be recorded in the undo-redo stack.

Example - send 2nd and 3rd shape to back

<button id="hideBtn">Shape 2 and 3 to back</button>
<div id="diagram"></div>
<script>
  $("#hideBtn").on("click", function(){
    var diagram = $("#diagram").getKendoDiagram();
    var shapes = [diagram.shapes[1], diagram.shapes[2]];
    diagram.toBack(shapes);
  });
  $("#diagram").kendoDiagram({
    shapes:[
      {
        id:"1",
        content:{
          text: "State 1"
        },
        x: 20,
        y: 20,
        stroke: {
          width: 1,
          color: "#0000ff"
        }
      },
      {
        id:"2",
        content: {
          text: "State 2"
        },
        x: 70,
        y: 20,
        stroke: {
          width: 1,
          color: "#00ff00"
        }
      },
      {
        id:"3",
        content: {
          text: "State 3"
        },
        x: 100,
        y: 20,
        stroke: {
          width: 1,
          color: "#00ff00"
        }
      }
    ]
  });
</script>