jianghh-canvas/es/index.d.ts

canvas画板，支持笔写、手写、鼠标流畅绘图，自动保存，撤销重做

import { ToolOptions } from './types';
import { CacheStack } from './stack';
import { IEventBus } from './event';
export * from './types';
/**
 * 配置
 */
export interface Options {
    el: string | HTMLCanvasElement;
    currentTool?: ToolType;
    createBufferCanvasStyle?: {
        [prop: string]: any;
    };
    allowType?: AllowType[];
    allowButton?: (0 | 1 | 2)[];
    width?: number;
    height?: number;
    lineWidth?: number;
    color?: string;
    containerHeightOffset?: number;
    cacheSize?: number;
    eraseSize?: number;
}
export type EventTypes = 'pointerdown' | 'pointermove' | 'pointerup';
export type ToolType = 'Cursor' | 'Marker' | 'Pen' | 'Line' | 'Rect' | 'Arc' | 'Erase';
export type AllowType = 'mouse' | 'touch' | 'pen' | (string & {});
export declare class CanvasGraffiti implements ToolOptions {
    options: Options;
    el: HTMLCanvasElement;
    isRevoke: boolean;
    cacheStack: CacheStack;
    beginPoint: {
        x: number;
        y: number;
    };
    endPoint: {
        x: number;
        y: number;
    } | undefined;
    points: {
        x: number;
        y: number;
    }[];
    private currentTool;
    bufferCanvas: HTMLCanvasElement | undefined;
    allowType: AllowType[];
    allowButton: (0 | 1 | 2 | number)[];
    containerHeightOffset: number;
    dpr: number;
    width: number;
    height: number;
    eraseSize: number;
    $on: IEventBus['on'];
    $emit: IEventBus['emit'];
    $off: IEventBus['off'];
    get color(): string | CanvasGradient | CanvasPattern;
    set color(value: string | CanvasGradient | CanvasPattern);
    get lineWidth(): number;
    set lineWidth(value: number);
    get tool(): any;
    set tool(value: any);
    static toolList: readonly [{
        readonly label: "光标";
        readonly value: "Cursor";
    }, {
        readonly label: "记号笔";
        readonly value: "Marker";
    }, {
        readonly label: "钢笔";
        readonly value: "Pen";
    }, {
        readonly label: "直线";
        readonly value: "Line";
    }, {
        readonly label: "空心矩形";
        readonly value: "Rect";
    }, {
        readonly label: "空心圆";
        readonly value: "Arc";
    }];
    static allowTypes: {
        label: string;
        value: string;
    }[];
    constructor(options: Options);
    get ctx(): CanvasRenderingContext2D;
    get bufferCtx(): CanvasRenderingContext2D;
    /**
     * 初始化
     */
    init(): void;
    private fixContent;
    bindCanvasEventListener(): void;
    removeEventListener(types?: EventTypes[]): void;
    updateHeight(containerHeight: number): void;
    pointerdown(event: PointerEvent): void;
    pointermove(event: PointerEvent): void;
    pointerup(event: PointerEvent): void;
    revoke(): void;
    redo(): void;
    clear(): void;
    emitStackChange(): void;
    private reviewImg;
    createBufferCanvas(): void;
    destroy(isRemoveCanvas?: boolean): void;
    toDataURL(type?: string, encoderOptions?: number): string;
    toPicFile(filename?: string): Promise<File>;
    setCurrentTool(tool: ToolType): void;
}
export default CanvasGraffiti;