DiagramShapeConnectorBuilder

Methods

Description(System.String)

Defines the connector description.

Parameters

value - System.String

The value that configures the description.

Example

             @(Html.Kendo().Diagram()
               .Name("diagram")
               .Shapes(shape => shape
                 .Add().Connectors(cc =>
                 {
                    cc.Add().Name("top").Description("top connector description");
                    cc.Add().Name("right").Description("right connector description");
                 }))
             )

Name(System.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.

Parameters

value - System.String

The value that configures the name.

Example

             @(Html.Kendo().Diagram()
               .Name("diagram")
               .Shapes(shape => shape
                 .Add().Connectors(cc =>
                 {
                    cc.Add().Name("top");
                    cc.Add().Name("right");
                 }))
             )

Position(System.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.

Parameters

value - System.String

The name of the JavaScript function that positions the connector.

Example

             @(Html.Kendo().Diagram()
               .Name("diagram")
               .Shapes(shape => shape
                 .Add().Connectors(cc =>
                 {
                    cc.Add().Name("Upstream").Position("getTopPosition");
                 }))
             )
            <script>
                function getTopPosition(shape) {
                     return shape._transformPoint(shape.bounds().top());
                }
            </script>

Position(System.Func)

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.

Parameters

handler - System.Func<Object,Object>

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

Example

             @(Html.Kendo().Diagram()
               .Name("diagram")
               .Shapes(shape => shape
                 .Add().Connectors(cc =>
                 {
                    cc.Add().Name("Upstream").Position(@<text>
                      function(shape) {
                        return shape._transformPoint(shape.bounds().top());
                      }
                      </text>);
                 }))
             )

Width(System.Double)

Defines the width of the shape connectors.

Parameters

value - System.Double

The value that configures the width.

Example

             @(Html.Kendo().Diagram()
               .Name("diagram")
               .Shapes(shape => shape
                 .Add().Connectors(cc =>
                 {
                    cc.Add().Name("top").Width(20);
                 }))
             )

Height(System.Double)

Defines the height of the shape connectors.

Parameters

value - System.Double

The value that configures the height.

Example

             @(Html.Kendo().Diagram()
               .Name("diagram")
               .Shapes(shape => shape
                 .Add().Connectors(cc =>
                 {
                    cc.Add().Name("top").Height(20);
                 }))
             )

Fill(System.Action)

Defines the fill options of the shape connectors.

Parameters

configurator - System.Action<DiagramFillSettingsBuilder>

The action that configures the fill.

Example

             @(Html.Kendo().Diagram()
               .Name("diagram")
               .Shapes(shape => shape
                 .Add().Connectors(cc =>
                 {
                    cc.Add().Fill(f => f.Color("red").Opacity(0.5));
                 }))
             )

Stroke(System.Action)

Defines the stroke options of the shape connectors.

Parameters

configurator - System.Action<DiagramStrokeSettingsBuilder>

The action that configures the stroke.

Example

             @(Html.Kendo().Diagram()
               .Name("diagram")
               .Shapes(shape => shape
                 .Add().Connectors(cc =>
                 {
                    cc.Add().Stroke(s => s.Color("red").Width(3));
                 }))
             )

Hover(System.Action)

Defines the hover configuration of the shape connectors.

Parameters

configurator - System.Action<DiagramHoverSettingsBuilder>

The action that configures the hover.

Example

             @(Html.Kendo().Diagram()
               .Name("diagram")
               .Shapes(shape => shape
                 .Add().Connectors(cc =>
                 {
                    cc.Add().Hover(h => h.Fill(f => f.Color("pink")));
                 }))
             )