Bug with addConnection

[Jong]

Hello.

There is a bug with diagram.addConnection();

I followed the sample in this page (https://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/diagram/methods/addconnection), and I'm getting an error when clicking on the connection.

I created a Dojo snippet (https://dojo.telerik.com/eluKEMOn) and you can reproduce the bug by

1. Clicking the Run button.

2. Clicking the connection that connects the shapes.

This generates an Uncaught TypeError: Cannot read property 'tools' of undefined, and this messes up the diagram.

Is there a workaround to this? I need to add connections after the diagram is initialized.

And addShape() takes both kendo.dataviz.diagram.Shape() and a plan object like this.

{
  id: "2",
  content: {
    text: "State 2"
  },
  x: 300,
  y: 20
}

But addConnection only takes kendo.dataviz.diagram.Connection().

Do you have any plans to accept a pure javascript object for addConnection()?

Attached is the screenshot of an error produced by the Dojo snippet.

Thank you!

[Alex Hajigeorgieva]

Hello, Jong,

Thank you for the provided steps to reproduce the behaviour.

It does seem to be a bug that is related to the selection of the connection.

While we investigate the cause, you can use the diagram.connect() method instead:

https://dojo.telerik.com/iHAWoMEk

Or, set a selectable: false as a connection option

https://dojo.telerik.com/eluKEMOn/4

As for the second question if we plan to change the parameters the method accepts. Currently, there are no such feature requests logged in our feedback portal. If you feel that it would be a good addition, I can log one request on your behalf:

https://feedback.telerik.com/kendo-jquery-ui/search?searchterm=addConnection

The most popular items make their way to our roadmap.

Kind Regards,
Alex Hajigeorgieva
Progress Telerik

[Jong]

So, the problem with diagram.connect() is I cannot change the connection option.

I need to dynamically change the connections text, stroke and paths.

I also need to set an id to the connection so that I can get the connection back later.

Or is there a way to change the connections text, stroke, paths and id after calling diagram.connect()?

[Jong]

Oh, never mind!

I didn't see the dojo sample you provided.

I didn't know diagram.connect() accepts options.

Thank you!

[Georgi]

Hello Jong,

It is necessary to extend the custom options of the connection with the connectionDefaults settings when creating a connection manually.

e.g.

var connection = new kendo.dataviz.diagram.Connection(shape1, shape2, $.extend(true, {}, diagram.options.connectionDefaults,{ stroke: { color: "red" }}));

Nevertheless, the diagram.connect method will do it for you behind the scenes and in such scenarios we would recommend using it instead of addConection.

Regards,
Georgi
Progress Telerik