DiagramConnectionBuilder
Methods
DataItem(System.Object)
Defines the connection dataItem.
Parameters
value - System.Object
The value that configures the data item.
Content(System.Action)
Defines the content settings of the connection.
Parameters
configurator - System.Action<DiagramConnectionContentSettingsBuilder>
The action that configures the content settings.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Connections(connection =>
{
connection.Add().Content(c => c.Text("Step 1").FontSize(16));
})
)
Editable(System.Boolean)
Defines the connection editable options.
Parameters
enabled - System.Boolean
The value that toggles the editable option.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Connections(connection =>
{
connection.Add().Editable(false);
})
)
Editable(System.Action)
Defines the connection editable options.
Parameters
configurator - System.Action<DiagramConnectionEditableSettingsBuilder>
The action that configures the editable settings.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Connections(connection =>
{
connection.Add().Editable(edit => edit.Tools(tool => tool.Edit().Text("Update")));
})
)
EndCap(System.Action)
Defines the connection end cap configuration.
Parameters
configurator - System.Action<DiagramConnectionEndCapSettingsBuilder>
The action that configures the end cap settings.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Connections(connection =>
{
connection.Add().EndCap(endcap => endcap.Type("ArrowEnd").Stroke(s => s.Color("blue")));
})
)
From(System.Action)
Defines the source of the connection. You can set this property to a value matching a shape id or to an object with XY-coordinates.
Parameters
configurator - System.Action<DiagramConnectionFromSettingsBuilder>
The action that configures the source settings.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Connections(connection =>
{
connection.Add().From(f => f.X(20).Y(70));
})
)
FromConnector(System.String)
Specifies the name of the source shape connector that must be used by the connection.
Parameters
value - System.String
The value that configures the source connector.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Connections(connection =>
{
connection.Add().FromConnector("bottom");
})
)
Hover(System.Action)
Defines the hover configuration of the connection.
Parameters
configurator - System.Action<DiagramConnectionHoverSettingsBuilder>
The action that configures the hover settings.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Connections(connection =>
{
connection.Add().Hover(h => h.Stroke(s => s.Color("red")));
})
)
Selectable(System.Boolean)
Specifies if the connection can be selected.
Parameters
value - System.Boolean
The value that configures the selectable.
Points(System.Action)
Sets the intermediate points (in global coordinates) of the connection. It is important to note that currently these points cannot be manipulated through the interface.
Parameters
configurator - System.Action<DiagramConnectionPointFactory>
The action that configures the points.
Selection(System.Action)
Defines the connection selection configuration.
Parameters
configurator - System.Action<DiagramConnectionSelectionSettingsBuilder>
The action that configures the selection options.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Connections(connection =>
{
connection.Add().Selection(s => s.Handles(h=> h.Width(20).Height(20)));
})
)
StartCap(System.Action)
Defines the connection start cap configuration.
Parameters
configurator - System.Action<DiagramConnectionStartCapSettingsBuilder>
The action that configures the start cap.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Connections(connection =>
{
connection.Add().StartCap(sc => sc.Fill(f => f.Color("red")).Stroke(s => s.Color("blue")));
})
)
Stroke(System.Action)
Defines the stroke configuration of the connection.
Parameters
configurator - System.Action<DiagramConnectionStrokeSettingsBuilder>
The action that configures the stroke settings.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Connections(connection =>
{
connection.Add().Stroke(s => s.Color("#33ccff").Width(3));
})
)
To(System.Action)
Defines the target of the connection. You can set this property to a value matching a shape id or to an object with XY-coordinates.
Parameters
configurator - System.Action<DiagramConnectionToSettingsBuilder>
The action that configures the target settings.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Connections(connection =>
{
connection.Add().To(t => t.X(450).Y(70));
})
)
ToConnector(System.String)
Specifies the name of the target shape connector that must be used by the connection.
Parameters
value - System.String
The value that configures the target connector.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Connections(connection =>
{
connection.Add().ToConnector("bottom");
})
)
CornerRadius(System.Double)
Defines the corner radius of the connection.
Parameters
value - System.Double
The value that configures the corner radius.
Accessibility(System.Action)
Defines accessibility options for the connection.
Parameters
configurator - System.Action<DiagramConnectionAccessibilitySettingsBuilder>
The action that configures the accessibility.
Type(Kendo.Mvc.UI.DiagramConnectionType)
Specifies the connection type that defines the way it routes. The routing of a connection is the way intermediate points of a connection define a route. A route is usually defined on the basis of constraints or behaviors. Currently, there are two routing mechanisms for Diagram connections: - Polyline route - Connects the defined intermediate points. - Cascading route - A simple rectangular route that creates a cascading path between the two ends of a connection, ignoring given connection points. The cascading type is useful when using tree layout and hierarchies. The routed connection will in this case enhance the representation of the hierarchy, reproducing a classic organization diagram.
Parameters
value - DiagramConnectionType
The enum value that configures the type option.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Connections(connection =>
{
connection.Add().Type(DiagramConnectionType.Cascading);
})
)
EndCap(System.String)
Sets the connection end cap type name. The supported values are: "none", "ArrowEnd", and "FilledCircle". You can also use "ArrowStart", but its direction will be inversed.
Parameters
type - System.String
The value that configures the end cap type.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Connections(connection =>
{
connection.Add().EndCap("FilledCircle");
})
)
StartCap(System.String)
Defines the connection start cap type. The supported values are: "none", "ArrowStart", and "FilledCircle".
Parameters
type - System.String
The value that configures the start cap type.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Connections(connection =>
{
connection.Add().StartCap("FilledCircle");
})
)