DiagramEditableSettingsBuilder
Methods
ConnectionTemplate(System.String)
Specifies the connection editor template, which shows up when editing the connection. A template can be used to change the default editors for the connection fields or to prevent some fields from being edited by not rendering an editor input for them.
Parameters
value - System.String
The value that configures the connection template.
ConnectionTemplateId(System.String)
Specifies the connection editor template, which shows up when editing the connection. A template can be used to change the default editors for the connection fields or to prevent some fields from being edited by not rendering an editor input for them.
Parameters
value - System.String
The name of the Kendo UI external template.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(e => e.ConnectionTemplateId("connectionEditorTemplate"))
)
ConnectionTemplateView(System.Web.Mvc.MvcHtmlString)
Specifies the connection editor template, which shows up when editing the connection. A template can be used to change the default editors for the connection fields or to prevent some fields from being edited by not rendering an editor input for them.
Parameters
value - System.Web.Mvc.MvcHtmlString
The Razor View that will be used for rendering the template.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(e => e.ConnectionTemplateView(Html.Partial("ConnectionTemplateView")))
)
ConnectionTemplateHandler(System.String)
Specifies the connection editor template, which shows up when editing the connection. A template can be used to change the default editors for the connection fields or to prevent some fields from being edited by not rendering an editor input for them.
Parameters
value - System.String
The JavaScript function that will return the template content.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(e => e.ConnectionTemplateHandler("getConnectionTemplate"))
)
ConnectionTemplate(Kendo.Mvc.UI.Fluent.TemplateBuilder)
Specifies the connection editor template which shows up when editing the connection. A template can be used to change the default editors for the connection fields or to prevent some fields from being edited by not rendering an editor input for them.
Parameters
template - TemplateBuilder<TModel>
A Template component that configures the connectiontemplate.
Drag(System.Boolean)
Specifies if the shapes and connections can be dragged.
Parameters
enabled - System.Boolean
The value that enables or disables the Drag option.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(e => e.Drag(true))
)
Drag(System.Action)
Specifies if the shapes and connections can be dragged.
Parameters
configurator - System.Action<DiagramEditableDragSettingsBuilder>
The action that configures the drag settings.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(e => e.Drag(d => d.Snap(s => s.Size(80))))
)
Remove(System.Boolean)
Specifies if the shapes and connections can be removed.
Parameters
value - System.Boolean
The value that enables or disables the Remove option.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(e => e.Remove(true))
)
Resize(System.Boolean)
Defines the look-and-feel of the resizing handles.
Parameters
enabled - System.Boolean
The value that enables or disables the Resize option.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(e => e.Resize(true))
)
Resize(System.Action)
Defines the look-and-feel of the resizing handles.
Parameters
configurator - System.Action<DiagramEditableResizeSettingsBuilder>
The action that configures the resize settings.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(e => e.Resize(r => r.Width(20).Height(20)))
)
Rotate(System.Boolean)
Specifies whether the shapes can be rotated.
Parameters
enabled - System.Boolean
The value that enables or disables the Rotate option.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(e => e.Rotate(true))
)
Rotate(System.Action)
Specifies rotate settings of the shapes.
Parameters
configurator - System.Action<DiagramEditableRotateSettingsBuilder>
The action that configures the rotate settings.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(e => e.Rotate(r => r.Fill(f => f.Color("green"))))
)
ShapeTemplate(System.String)
Specifies the shape editor template. You can use it to customize the editing UI of the shape or to display editor controls only for certain fields of the shape data item.
Parameters
value - System.String
The value that configures the editor template.
ShapeTemplateId(System.String)
Specifies the shape editor template. You can use it to customize the editing UI of the shape or to display editor controls only for certain fields of the shape data item.
Parameters
value - System.String
The name of the Kendo UI external template.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(editable => editable.ShapeTemplateId("shapeEditorTemplate"))
)
ShapeTemplateView(System.Web.Mvc.MvcHtmlString)
Specifies the shape editor template. You can use it to customize the editing UI of the shape or to display editor controls only for certain fields of the shape data item.
Parameters
value - System.Web.Mvc.MvcHtmlString
The Razor View that will be used for rendering the template.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(editable => editable.ShapeTemplateView(Html.Partial("ShapteTemplateView")))
)
ShapeTemplateHandler(System.String)
Specifies the shape editor template. You can use it to customize the editing UI of the shape or to display editor controls only for certain fields of the shape data item.
Parameters
value - System.String
The JavaScript function that will return the template content.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(editable => editable.ShapeTemplateHandler("getShapeEditorTemplate"))
)
ShapeTemplate(Kendo.Mvc.UI.Fluent.TemplateBuilder)
Specifies the shape editor template. You can use it to customize the editing UI of the shape or to display editor controls only for certain fields of the shape data item.
Parameters
template - TemplateBuilder<TModel>
A Template component that configures the shapetemplate.
Tools(System.Action)
Specifies the toolbar tools.
Parameters
configurator - System.Action<DiagramEditableSettingsToolFactory>
The action that configures the tools.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(editable => editable.Tools(tool =>
{
tool.Edit();
tool.CreateConnection();
tool.CreateShape();
tool.Undo();
tool.Redo();
tool.RotateClockwise();
tool.RotateAnticlockwise();
}))
)
ShapeTemplateName(System.String)
Specifies the name of the shape editor template. You can use it to customize the editing UI of the shape or to display editor controls only for certain fields of the shape data item.
Parameters
value - System.String
The name of the Razor view editor template.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(editable => editable.ShapeTemplateName("DiagramShapeEditor"))
)
ConnectionTemplateName(System.String)
Specifies the name of the connection editor template.
Parameters
value - System.String
The name of the Razor view editor template.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(editable => editable.ConnectionTemplateName("DiagramShapeEditor"))
)
ShapeTemplateComponentName(System.String)
Specifies the name of the editor template that contains a Template component, which defines the editors for the shape data item. The editor template must be added in the 'Views/Shared/EditorTemplates/' folder.
Parameters
templateName - System.String
The name of the Razor view editor template.
Example
@(Html.Kendo().Diagram()
.Name("diagram")
.Editable(editable => editable.ShapeTemplateComponentName("DiagramShapeEditor"))
)