Static Methods
usePlugin
ts
// Use a plugin
usePlugin(plugin: typeof Plugin): ImageMark
unusePlugin
ts
// Unuse a plugin
unusePlugin(plugin: typeof Plugin): ImageMark
hasPlugin
ts
// Check if a plugin is in use
hasPlugin(plugin: typeof Plugin): boolean
useDefaultPlugin
Use default plugins, which include the built-in shape
and selection
plugins
ts
useDefaultPlugin(): void
unuseDefaultPlugin
ts
// Unuse default plugins
unuseDefaultPlugin(): void
Instance Methods
resize
ts
// Triggered when the container size changes
resize(): void
rerender
ts
// Triggered when re-rendering
rerender(): void
destroy
ts
// Destroy the instance
destroy(): void
addDefaultAction
ts
// Add default actions to the instance, currently including canvas zooming and moving
addDefaultAction(): ImageMark
removeDefaultAction
ts
// Remove default actions from the instance
removeDefaultAction(): ImageMark
addStageLmbDownMoveing
ts
// Add canvas moving
addStageLmbDownMoveing(): ImageMark
removeStageLmbDownMoveing
ts
// Remove canvas moving
removeStageLmbDownMoveing(): ImageMark
addStageMouseScale
ts
// Add canvas zooming
addStageMouseScale(): ImageMark
removeStageMouseScale
ts
// Remove canvas zooming
removeStageMouseScale(): ImageMark
moveTo
ts
export type Position =
| 'left-top'
| 'right-top'
| 'left-bottom'
| 'right-bottom'
| 'top'
| 'bottom'
| 'left'
| 'right'
| 'center'
// Move to a specified position
moveTo(position: Position): ImageMark
move
ts
export type ArrayPoint = [number, number]
// Move to specified coordinates
move(point: ArrayPoint): ImageMark
startSuccessiveMove
ts
// Start successive moving
startSuccessiveMove(point: ArrayPoint): ImageMark
moveSuccessive
ts
// Successive moving
moveSuccessive(point: ArrayPoint): ImageMark
endSuccessiveMove
ts
// Stop successive moving
endSuccessiveMove(): ImageMark
scale
ts
// Scale the canvas
scale(
direction: 1 | -1, // 1 for zoom-in, -1 for zoom-out
point: ArrayPoint | 'left-top' | 'center', // zoom-in point
reletiveTo: 'container' | 'image' = 'container', // relative to whom
newScale?: number // new scaling ratio, if provided, scale directly to this ratio
): ImageMark
scaleTo
ts
// Scale to a specific ratio
scaleTo(
options: ImageMarkOptions['initScaleConfig'],
point: ArrayPoint | 'left-top' | 'center', // zoom-in point
reletiveTo: 'container' | 'image' = 'container' // relative to whom
): ImageMark
setMinScale
ts
export type InitialScaleSize = 'fit' | 'original' | 'width' | 'height' | 'cover'
// Set minimum scaling ratio
setMinScale(minScale: number|InitialScaleSize): ImageMark
setMaxScale
ts
// Set maximum scaling ratio
setMaxScale(maxScale: number|InitialScaleSize): ImageMark
getCurrentScale
ts
// Get the current scale ratio
getCurrentScale(): number
on
Bind instance events, currently refer to the events documentation for events that can be listened to by the instance
ts
on(...rest: any): void // Reference the on method of eventemitter3
off
ts
// Unbind instance events
off(...rest: any): void // Reference the off method of eventemitter3
setEnableImageOutOfContainer
ts
// Set whether the image can be out of the container
setEnableImageOutOfContainer(enable: boolean): ImageMark
setEnableDrawShapeOutOfImg
ts
// Set whether the shape can be out of the image when drawing
setEnableDrawShapeOutOfImg(enable: boolean): ImageMark
setEnableMoveShapeOutOfImg
ts
// Set whether the shape can be out of the image when moving
setEnableMoveShapeOutOfImg(enable: boolean): ImageMark
setEnableShapeOutOfImg
ts
// Set whether the shape can be out of the image, including all actions, such as moving and drawing
setEnableShapeOutOfImg(enable: boolean): ImageMark
initPlugin
ts
export type PluginNewCall = (imageMarkInstance: ImageMark) => Plugin
// Initialize a plugin
initPlugin(plugin: typeof Plugin|PluginNewCall): ImageMark
addPlugin
ts
// Add a plugin
addPlugin(plugin: typeof Plugin|PluginNewCall): ImageMark
removePlugin
ts
//Remove a plugin from the instance
(plugin: typeof Plugin): ImageMark
getShapePlugin
ts
//Get the `shape plugin` instance on the instance
getShapePlugin(): ShapePlugin | null
getSelectionPlugin
ts
//Get the `selection plugin` instance on the instance
getSelectionPlugin(): SelectionPlugin | null