Progress® Telerik® UI for ASP.NET AJAX Feedback Portal
Back to Feed
Request a Feature Report a Bug
Completed
Last Updated: 24 Jul 2020 10:13 by ADMIN
ADMIN
Slav
Created on: 01 Jul 2015 10:32
Category: Diagram
Type: Feature Request
0
Add an option for specifying the maximum number of connections that start from a shape and end in a shape of RadDiagram
It will be possible to specify the maximum number of connections that start from a shape and end in a shape of RadDiagram.
1 comment
ADMIN
Vessy
Posted on: 24 Jul 2020 10:13

Hi,

The maximum number of the allowed connections per shape can be controlled through the API of the Diagram widget in its DragStart/DragEnd events. The ID of the current shape can be collected in the client-side MouseEnter event like follows:

        <script>
            var currShape = null;

            function onMouseEnter(e) {
                var shape = e.item;
                if (shape instanceof kendo.dataviz.diagram.Shape) {
                    currShape = shape;
                }
            }

            function onMouseLeave(e) {
                currShape = null;
            }

            function onDragStartEnd(e) {
                if (currShape.id != "p1" && currShape.connections().length > 1) {
                    alert("No more connections are allowed for this shape.");
                    e.preventDefault();
                }
            }
        </script>
        <telerik:RadDiagram ID="RadDiagram1" runat="server">
            <ClientEvents OnDragStart="onDragStartEnd" OnDragEnd="onDragStartEnd"
                OnMouseEnter="onMouseEnter" OnMouseLeave="onMouseLeave" />
            <ShapesCollection>
                <telerik:DiagramShape Id="p1" Type="rectangle" X="200" Y="50">
                    <ContentSettings Text="Parent" />
                </telerik:DiagramShape>
                <telerik:DiagramShape Id="c1" Type="circle" X="100" Y="200">
                    <ContentSettings Text="Child 1" />
                </telerik:DiagramShape>
                <telerik:DiagramShape Id="c2" Type="circle" X="300" Y="200">
                    <ContentSettings Text="Child 2" />
                </telerik:DiagramShape>
            </ShapesCollection>
        </telerik:RadDiagram>

 

A KB with this approach can be found here:
https://docs.telerik.com/devtools/aspnt-ajax/knowledge-base/diagram-max-connections-per-shape

Regards,
Vessy
Progress Telerik

Create an account Log In
View
Type
Status
Category