This article is an example of the Kendo Diagram Component. The framework used is the Kendo UI for jQuery. In this example, we are tasked to create a link graph.
Here are the requirements:
- Zoomable
- Not editable
- Nodes must be movable
- Connections between nodes have labels
Here is our solution. You can edit the code below using any text editor but I prefer Visual Studio Code. Make sure you are connected to the Internet because the code pulls the Kendo library from the Telerik CDN. Take note that this is just a demonstration code and you’ll need to purchase a license if you are going to use Kendo UI for jQuery for more than just evaluation purposes.
Open the HTML file in a browser and you should see an output similar to the one shown below.
There you have it. A quick and simple example of how to use the Kendo Diagram component.