Skip to content

Selection

Action for selecting a Shape with the mouse. When using the selection plugin, this action will be added to each Shape by the plugin. You can also add this action to a Shape instance yourself to replace the previous selection action, allowing you to customize the selection action style by adding initDrawFunc.

Options

ts
export type SelectionDrawFunc = (selection: SelectionAction) => void

export type SelectionActionAttr = {
	stroke?: StrokeData
	fill?: string
	padding?: number
	whileSelectedEditShape?: boolean // Whether to switch the current `Shape` to edit state when selected
}

export type SelectionActionOptions = {
	initDrawFunc?: SelectionDrawFunc
	setAttr?: (action: SelectionAction) => SelectionActionAttr //customize the selection action's attributes
}

Static Properties

actionName

selection

Instance Properties

selected

Indicates whether the current Shape is selected.

Instance Methods

getSelectionActionOptions

ts
// Get selectionAction configuration
getSelectionActionOptions(): SelectionActionOptions

getSelectionShape

ts
// Get the `Svg.js` shape instance of the selected `Shape`
getSelectionShape(): Shape | undefined

getSelectionId

ts
// Get the `id` of the selection for the currently selected `Shape`
getSelectionId(): string

disableSelection

ts
// Disable the `Selection` plugin
disableSelection(): void

enableSelection

ts
// Enable the `Selection` plugin
enableSelection(): void

destroy

ts
// Called when the `ImageMark` is `destroyed` or when `unuseAction` is invoked
destroy(): void