source

Gets or sets the current source of the connection.

This object can be a Point for a floating endpoint (i.e. not attached to a shape), a Shape or a Connector of a Shape. You can use the Shape.getConnector() method to fetch a Connector on the basis of its name. If a Shape is specified the Connection will attach to the "Auto" connector.

Parameters

source kendo.dataviz.diagram.Shape|kendo.dataviz.diagram.Point|kendo.dataviz.diagram.Connector

• Point: any Point on the canvas. This creates an unattached floating endpoint.
• Shape: will bind the endpoint to the"Auto" Connector which will switch between the other connectors to minimize the length of the connection.
• Connector: the connection's endpoint will remain fixed attached to the specified Connector.

If no source is specified the method will return the current object to which the Connection's endpoint is attached.

Returns

Object the connection source.

The following example shows how to change the source shape of a connection:

Example - configuring the source

<button id="changeSourceBtn">Change Connection Source</button>
<div id="diagram"></div>
<script>
  var Shape = kendo.dataviz.diagram.Shape;
  $("#diagram").kendoDiagram();
  var diagram = $("#diagram").data("kendoDiagram");
  var shape1 = diagram.addShape( new Shape({ x: 100, y: 100 }));
  var shape2 = diagram.addShape( new Shape({ x: 300, y: 180 }));
  var shape3 = diagram.addShape( new Shape({ x: 300, y: 20 }));

  var connection = new kendo.dataviz.diagram.Connection(shape1, shape2, {
    fromConnector: "left",
    type: "cascading",
    selectable: false
  });

  diagram.addConnection(connection);

  $("#changeSourceBtn").on("click", function(){
    var connection = diagram.connections[0];
    connection.source(shape3);
  });
</script>