Back to all docs
API Reference / Kendo.Mvc.UI.Fluent / DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel>
New to Telerik UI for ASP.NET MVC? Start a free 30-day trial

DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel>

Class

Defines the fluent API for configuring the DiagramShapeConnector settings.

Definition

Namespace:Kendo.Mvc.UI.Fluent

Assembly:Kendo.Mvc.dll

Type Parameters:

TShapeModel

TConnectionModel

Syntax:
C#
public class DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel> where TShapeModel : class where TConnectionModel : class

Inheritance: objectDiagramShapeConnectorBuilder<TShapeModel, TConnectionModel>

Inherited Members object.GetType()object.MemberwiseClone()object.ToString()object.Equals(object)object.Equals(object, object)object.ReferenceEquals(object, object)object.GetHashCode()...

Constructors

DiagramShapeConnectorBuilder(DiagramShapeConnector)

C#
public DiagramShapeConnectorBuilder(DiagramShapeConnector settings)
Parameters:settingsDiagramShapeConnector

Methods

Description(string)

Defines the connector description.

C#
public DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel> Description(string value)
Parameters:valuestring

The value that configures the description.

Returns:

DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel>

Example:
C#
@(Html.Kendo().Diagram()
.Name("diagram")
.Shapes(shape =&gt; shape
.Add().Connectors(cc =&gt;
{
cc.Add().Name("top").Description("top connector description");
cc.Add().Name("right").Description("right connector description");
}))
)

Fill(Action<DiagramFillSettingsBuilder<TShapeModel, TConnectionModel>>)

Defines the fill options of the shape connectors.

C#
public DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel> Fill(Action<DiagramFillSettingsBuilder<TShapeModel, TConnectionModel>> configurator)
Parameters:configuratorAction<DiagramFillSettingsBuilder<TShapeModel, TConnectionModel>>

The action that configures the fill.

Returns:

DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel>

Example:
C#
@(Html.Kendo().Diagram()
.Name("diagram")
.Shapes(shape =&gt; shape
.Add().Connectors(cc =&gt;
{
cc.Add().Fill(f =&gt; f.Color("red").Opacity(0.5));
}))
)

Height(double)

Defines the height of the shape connectors.

C#
public DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel> Height(double value)
Parameters:valuedouble

The value that configures the height.

Returns:

DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel>

Example:
C#
@(Html.Kendo().Diagram()
.Name("diagram")
.Shapes(shape =&gt; shape
.Add().Connectors(cc =&gt;
{
cc.Add().Name("top").Height(20);
}))
)

Hover(Action<DiagramHoverSettingsBuilder<TShapeModel, TConnectionModel>>)

Defines the hover configuration of the shape connectors.

C#
public DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel> Hover(Action<DiagramHoverSettingsBuilder<TShapeModel, TConnectionModel>> configurator)
Parameters:configuratorAction<DiagramHoverSettingsBuilder<TShapeModel, TConnectionModel>>

The action that configures the hover.

Returns:

DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel>

Example:
C#
@(Html.Kendo().Diagram()
.Name("diagram")
.Shapes(shape =&gt; shape
.Add().Connectors(cc =&gt;
{
cc.Add().Hover(h =&gt; h.Fill(f =&gt; f.Color("pink")));
}))
)

Name(string)

Defines the connector name. The built-in names are: "top" - top connector. "right" - right connector. "bottom" - bottom connector. "bottomRight" - bottom right connector. "left" - left connector. "auto" - auto connector.

C#
public DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel> Name(string value)
Parameters:valuestring

The value that configures the name.

Returns:

DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel>

Example:
C#
@(Html.Kendo().Diagram()
.Name("diagram")
.Shapes(shape =&gt; shape
.Add().Connectors(cc =&gt;
{
cc.Add().Name("top");
cc.Add().Name("right");
}))
)

Offset(double)

C#
public DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel> Offset(double value)
Parameters:valuedoubleReturns:

DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel>

Position(Func<object, object>)

Defines the inline handler that positions the connector. The function accepts a shape as parameter and must return a "kendo.dataviz.diagram.Point" indicating where the connector must be placed.

C#
public DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel> Position(Func<object, object> handler)
Parameters:handlerFunc<object, object>

The handler code wrapped in a text tag (Razor syntax).

Returns:

DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel>

Example:
C#
@(Html.Kendo().Diagram()
.Name("diagram")
.Shapes(shape =&gt; shape
.Add().Connectors(cc =&gt;
{
cc.Add().Name("Upstream").Position(@&lt;text&gt;
function(shape) {
return shape._transformPoint(shape.bounds().top());
}
&lt;/text&gt;);
}))
)

Position(string)

Defines the name of the JavaScript function that positions the connector. The function accepts a shape as parameter and must return a "kendo.dataviz.diagram.Point" indicating where the connector must be placed.

C#
public DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel> Position(string value)
Parameters:valuestring

The name of the JavaScript function that positions the connector.

Returns:

DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel>

Example:
C#
@(Html.Kendo().Diagram()
.Name("diagram")
.Shapes(shape =&gt; shape
.Add().Connectors(cc =&gt;
{
cc.Add().Name("Upstream").Position("getTopPosition");
}))
)
&lt;script&gt;
function getTopPosition(shape) {
return shape._transformPoint(shape.bounds().top());
}
&lt;/script&gt;

Stroke(Action<DiagramStrokeSettingsBuilder<TShapeModel, TConnectionModel>>)

Defines the stroke options of the shape connectors.

C#
public DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel> Stroke(Action<DiagramStrokeSettingsBuilder<TShapeModel, TConnectionModel>> configurator)
Parameters:configuratorAction<DiagramStrokeSettingsBuilder<TShapeModel, TConnectionModel>>

The action that configures the stroke.

Returns:

DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel>

Example:
C#
@(Html.Kendo().Diagram()
.Name("diagram")
.Shapes(shape =&gt; shape
.Add().Connectors(cc =&gt;
{
cc.Add().Stroke(s =&gt; s.Color("red").Width(3));
}))
)

Width(double)

Defines the width of the shape connectors.

C#
public DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel> Width(double value)
Parameters:valuedouble

The value that configures the width.

Returns:

DiagramShapeConnectorBuilder<TShapeModel, TConnectionModel>

Example:
C#
@(Html.Kendo().Diagram()
.Name("diagram")
.Shapes(shape =&gt; shape
.Add().Connectors(cc =&gt;
{
cc.Add().Name("top").Width(20);
}))
)
In this article
DefinitionConstructorsDiagramShapeConnectorBuilder(DiagramShapeConnector)MethodsDescription(string)Fill(Action<DiagramFillSettingsBuilder<TShapeModel, TConnectionModel>>)Height(double)Hover(Action<DiagramHoverSettingsBuilder<TShapeModel, TConnectionModel>>)Name(string)Offset(double)Position(Func<object, object>)Position(string)Stroke(Action<DiagramStrokeSettingsBuilder<TShapeModel, TConnectionModel>>)Width(double)
Not finding the help you need?
Contact Support