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

Drag and Drop in Diagram with attributes

3 Answers 46 Views
Diagram
This is a migrated thread and some comments may be shown as answers.
Sandhia
Top achievements
Rank 1
Sandhia asked on 22 Jul 2019, 07:15 PM

Hello

We have a requirement to do the following.  Can you please tell me whether it is doable (or how much of it is doable) at the moment using Telerik Diagram.  If it is, can you please point me to a starting point?

So we need to --

- allow user to drag and drop blocks into a canvas

- be able to relate blocks

- have a popup appear when relating two blocks to allow input of one or more attributes

- allow editing of relationship by may be double clicking on the relational lines

- save diagram on a web page

- export diagram to excel

- have an auto-layout button option or allow user to manually move boxes around

- allow user to color code blocks based on some attribute

 

I did find a page

https://demos.telerik.com/aspnet-ajax/diagram/examples/interactions/defaultcs.aspx

 

that does some of what we want but not everything.

 

Any help will be appreciated.

Thank you

Sandhia

3 Answers, 1 is accepted

Sort by
0
Vessy
Telerik team
answered on 24 Jul 2019, 04:07 PM

Hi Sandhia,

Almost all of the listed features are implemented/demonstrated in our Diagramming Tool, so you can find it useful as a base for your implementation:

https://demos.telerik.com/aspnet-ajax/sample-applications/diagram-app/

The whole source code for it is available for downloading here (the top right corner of the page)

https://demos.telerik.com/aspnet-ajax/sample-applications/diagram-app/DiagramAppSource.zip

 

Please, examine the sample app linked above and let me know if I can assist you any further on this matter.

 

Regards, Vessy
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Sandhia
Top achievements
Rank 1
answered on 24 Jul 2019, 04:26 PM

Hello Vessy

Thank you so much for the information.  However I am very new to 'diagraming' and so am a bit clueless.

I don't see how to connect two shapes via arrows or how to insert attributes for the blocks and the connectors.  For ex., I may want to name two blocks "A" and "B" and have the connector line have an attribute that says "builds". 

This example seems to have the blocks and relationships hardcodes in the page.  Where can I find an example of diagram being generate dynamically?

Thanks again.
Sandhia

0
Vessy
Telerik team
answered on 29 Jul 2019, 10:07 AM

Hi Sandhia,

Indeed the given sample app demonstrates a more complex scenario. If you want to see a basic sample on how to create diagram along with shapes and connection dynamically, you can refer the following article:

https://docs.telerik.com/devtools/aspnet-ajax/controls/diagram/server-side-programming#configuring-a-diagram-from-the-code-behind

 

Another (simpler) approach on how to drag and drop shapes into diagram can be seen here:

https://demos.telerik.com/aspnet-ajax/diagram/examples/interactions/defaultcs.aspx

 

Regards, Vessy
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Diagram
Asked by
Sandhia
Top achievements
Rank 1
Answers by
Vessy
Telerik team
Sandhia
Top achievements
Rank 1
Share this question
or