This is a migrated thread and some comments may be shown as answers.

Bug with addConnection

4 Answers 84 Views
Diagram
This is a migrated thread and some comments may be shown as answers.
Jong
Top achievements
Rank 1
Veteran
Jong asked on 18 Jan 2021, 09:57 PM

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!

4 Answers, 1 is accepted

Sort by
0
Accepted
Alex Hajigeorgieva
Telerik team
answered on 20 Jan 2021, 04:40 PM

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

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
Jong
Top achievements
Rank 1
Veteran
answered on 20 Jan 2021, 04:55 PM

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()?

0
Jong
Top achievements
Rank 1
Veteran
answered on 20 Jan 2021, 04:58 PM

Oh, never mind!

I didn't see the dojo sample you provided.

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

Thank you!

0
Georgi
Telerik team
answered on 22 Jan 2021, 11:52 AM

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

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Diagram
Asked by
Jong
Top achievements
Rank 1
Veteran
Answers by
Alex Hajigeorgieva
Telerik team
Jong
Top achievements
Rank 1
Veteran
Georgi
Telerik team
Share this question
or