Introduction
Getting Started
Vue 2 End of Support
Native Components
Wrapper Components
- Introduction
- Barcodes
- Buttons
- Charts
- Chat
- DataSource
- Date Inputs
- Diagram
- - Overview
  - Built-In Layouts
  - Editing
  - Export Options
  - API
- Dialog
- Dropdowns
- DropDownTree
- Editor
- Gantt
- Gauges
- Grid (wrapper)
- Inputs
- Layout
- List Views
- ListBox
- Map
- MediaPlayer
- PivotGrid
- Popups
- Scheduler
- ScrollView
- Spreadsheet
- TreeList
- TreeMap
- TreeView
- Upload
- Validator
- Window
- Framework & Features
- Globalization
- Troubleshooting
- Using Wrapper Components in Vite
Sample Applications
Styling & Themes
Common Features
Project Setup
Knowledge Base
Changelog
FAQ
Troubleshooting

Components / Diagram / API / shapeDefaultsProps API /

New to Kendo UI for Vue? Start a free 30-day trial

ShapeDefaultsProps

shape-defaults-connectors `Array`

Defines the connectors the shape owns. A connector is the point in the shape where a connection between this shape and another one can originate from or end.

The supported values are:

top—A top connector.
right—A right connector.
bottom—A bottom connector.
bottomRight—A bottom right connector.
left—A left connector.
auto—An auto connector.

You can define your own custom connectors or use the predefined types.

shape-defaults-connector-defaults-width `Number`

Defines the width of the shape connectors.

shape-defaults-connector-defaults-height `Number`

Defines the height of the shape connectors.

shape-defaults-connector-defaults-hover-fill `String`

Defines the hover fill options of the shape connectors.

shape-defaults-connector-defaults-hover-fill-color `String`

Defines the hover fill color of the shape connectors.

shape-defaults-connector-defaults-hover-fill-opacity `Number`

Defines the hover fill opacity of the shape connectors.

shape-defaults-connector-defaults-hover-stroke `String`

Defines the hover stroke options of the shape connectors.

shape-defaults-connector-defaults-hover-stroke-color `String`

Defines the hover stroke color.

shape-defaults-connector-defaults-hover-stroke-dash-type `String`

The dash type of the hover stroke.

The supported dash types are:

dash—A line that consists of dashes.
dashDot—A line that consists of a repeating dash-dot pattern.
dot—A line that consists of dots.
longDash—A line that consists of a repeating long-dash pattern.
longDashDot—A line that consists of a repeating long-dash-dot pattern.
longDashDotDot—A line that consists of a repeating long-dash-dot-dot.
solid—A solid line.

shape-defaults-connector-defaults-hover-stroke-width `Number`

Defines the thickness or width of the shape connectors stroke on hover.

shape-defaults-connector-defaults-fill `String`

Defines the fill options of the shape connectors.

shape-defaults-connector-defaults-fill-color `String`

Defines the fill color of the shape connectors.

shape-defaults-connector-defaults-fill-opacity `Number`

Defines the fill opacity of the shape connectors.

shape-defaults-connector-defaults-stroke `String`

Defines the stroke options of the shape connectors.

shape-defaults-connector-defaults-stroke-color `String`

Defines the stroke color.

shape-defaults-connector-defaults-stroke-dash-type `String`

Defines the stroke dash type.

The supported dash types are:

dash—A line that consists of dashes.
dashDot—A line that consists of a repeating dash-dot pattern.
dot—A line that consists of dots.
longDash—A line that consists of a repeating long-dash pattern.
longDashDot—A line that consists of a repeating long-dash-dot pattern.
longDashDotDot—A line that consists of a repeating long-dash-dot-dot.
solid—A solid line.

shape-defaults-connector-defaults-stroke-width `Number`

Defines the thickness or width of the shape connectors stroke.

shape-defaults-content-align `String`

The alignment of the text inside the shape.

The supported values are:

(Vertical alignment) top, middle, and bottom.
(Horizontal alignment) right, center, and left.

You can also combine the vertical and horizontal values—for example, top right, middle left, bottom center, and so on.

shape-defaults-content-color `String`

The color of the shape content text.

shape-defaults-content-font-family `String`

The font family of the shape content text.

shape-defaults-content-font-size `Number`

The font size of the shape content text.

shape-defaults-content-font-style `String`

The font style of the shape content text.

shape-defaults-content-font-weight `String`

The font weight of the shape content text.

shape-defaults-content-template `String | Function`

The template which renders the labels. The template supports the dataItem field which represents the data item if a field was specified.

shape-defaults-content-text `String`

The text that is displayed in the shape.

shape-defaults-editable `Boolean`

Defines the editable options of the shape.

shape-defaults-editable-connect `Boolean`

Specifies if new connections can be added by using the shapes connectors.

shape-defaults-editable-drag `Boolean`

Specifies if the shapes can be dragged.

shape-defaults-editable-remove `Boolean`

Specifies if the shapes can be removed.

shape-defaults-editable-tools `Array`

Specifies the tools of the toolbar. Supports all supported toolbar.items options.

The predefined tools are:

edit—The selected item can be edited.
delete—The selected items can be deleted.
rotateClockwise—The selected items can be rotated clockwise. The default rotation value is 90 degrees.
rotateAnticlockwise—The selected items can be rotated anticlockwise. The default rotation value is 90 degrees.

shape-defaults-fill `String`

Defines the fill options of the shape. Use these settings to apply a single-color or a gradient background to all shapes in the Diagram.

shape-defaults-fill-color `String`

Defines the fill color of the shape.

shape-defaults-fill-opacity `Number`

Defines the fill opacity of the shape.

shape-defaults-fill-gradient-type `String`

The type of the gradient. The supported values are: linear or radial.

shape-defaults-fill-gradient-center `Array`

The center of the radial gradient. The coordinates are relative to the shape-bounding box—for example, [0, 0] is top left and [1, 1] is bottom right.

shape-defaults-fill-gradient-radius `Number`

The radius of the radial gradient relative to the shape bounding box.

shape-defaults-fill-gradient-start `Array`

The start point of the linear gradient. The coordinates are relative to the shape-bounding box—for example, [0, 0] is top left and [1, 1] is bottom right.

shape-defaults-fill-gradient-end `Array`

The end point of the linear gradient. The coordinates are relative to the shape-bounding box—for example, [0, 0] is top left and [1, 1] is bottom right.