初始化实例

<div id="image-mark"></div>

import ImageMark from 'mark-img'

const imageMark = new ImageMark({
	// options
	el: ContainerType  // 容器元素或者元素的selector 如 #container
	src: string   // 图片的 URL 地址
	initScaleConfig?: ({  // 初始化图片缩放的配置项
		to?: 'image' // 缩放的目标为image的尺寸
	} | {
		to: 'box' // 缩放的目标为指定的矩形框的尺寸
		box: BoundingBox // 缩放的矩形框的bbox
	}) & {
		startPosition?: StartPosition  //image 或者 box 的起始位置, 默认`center`
		size?: InitialScaleSize //缩放的尺寸, 默认`fit`
		/**
		 * 留白
		 *  */
		padding?: number // 缩放的边距, 默认`0.1`
		paddingUnit?: 'px' | '%' // 边距的单位 默认`%`
	}
	action?: {
		enableDrawShapeOutOfImg?: boolean // 是否允许绘制时超出图片, 默认`false`
		enableMoveShapeOutOfImg?: boolean // 是否允许移动时超出图片, 默认`false`
		enableImageOutOfContainer?: boolean // 是否允许图片超出容器, 默认`true`
	}
	pluginOptions?: {
		[key: string]: any // [插件名称]：[插件配置] 插件的配置项，具体请参考插件文档
	}
})

Types

export type ContainerType = string | HTMLElement;

export type BoundingBox = {
	x: number
	y: number
	width: number
	height: number
}

export type StartPosition = 'center' | 'left-top' | 'right-top' | 'left-bottom' | 'right-bottom'

export type InitialScaleSize = 'fit' | 'original' | 'width' | 'height' | 'cover'