hx-white-board/dist/packages/WhiteBoard/core/index.d.ts

```bash npm install hx-white-board ```

import { Canvas as ICanvas, ICanvasOptions, ICircleOptions, IEllipseOptions, IEvent, IImageOptions, ILineOptions, Image as IImage, IRectOptions, ITextOptions, ITriangleOptions, Object as IObject, Pattern } from 'fabric/fabric-impl';
import EventEmitter from '../utils/emitter';
import { LogLevel } from '../utils/logger';
/**
 * fabric方法封装
 * 使用示例：
 * const canvas = new FabricCanvas('canvas');
 *
 * // 绘制线条
 * canvas.drawLine(10, 10, 100, 100, { stroke: 'red', strokeWidth: 2 });
 *
 * // 绘制箭头
 * canvas.drawArrow(10, 50, 100, 50, { stroke: 'blue', strokeWidth: 2 });
 *
 * // 绘制矩形
 * canvas.drawRect({ left: 50, top: 150, width: 100, height: 50, fill: 'green', stroke: 'black' });
 *
 * // 绘制圆形
 * canvas.drawCircle({ left: 200, top: 100, radius: 50, fill: 'yellow', stroke: 'black' });
 *
 * // 绘制文本
 * canvas.drawText('Hello World!', { left: 50, top: 250, fontSize: 24, fill: 'red' })
 *
 * // 插入图片
 * canvas.insertImage('https://picsum.photos/200', { left: 50, top: 150, scaleX: 0.5, scaleY: 0.5 });
 *
 * // 橡皮擦
 * canvas.erase({ width: 10 });
 *
 * // 画笔
 * canvas.drawFreeDraw();
 */
interface FabricEvents {
    'object:added': IEvent;
    'object:modified': IEvent;
    'object:removed': IEvent;
    'mouse:down': IEvent;
    'mouse:move': IEvent;
    'mouse:up': IEvent;
    'after:render': IEvent;
    'text:editing:exited': IEvent;
    [key: string | symbol]: IEvent | any | undefined;
}
interface Pointer {
    x: number;
    y: number;
}
export declare type DrawingTool = 'rectangle' | 'triangle' | 'triangle-filler' | 'triangle-opacity' | 'circle' | 'circle-filler' | 'circle-opacity' | 'ellipse' | 'line' | 'pointer' | 'arrow' | 'text' | 'pencil' | 'select' | 'eraser' | 'rect-filler' | 'rect-opacity' | 'double-arrow' | 'dot' | '';
export declare enum ShapeOpacity {
    fully = 1,
    translucency = 0.7,
    zero = 0
}
/**
 * 绘图选项
 * @param stroke 线条颜色
 * @param strokeWidth 线条宽度
 * @param fill 填充颜色
 * @param opacity 透明度
 */
export interface ShapeOptions {
    stroke?: string;
    strokeWidth?: number;
    fill?: string;
    opacity?: ShapeOpacity;
}
/**
 * rgba颜色
 */
export interface IColor {
    r: number;
    g: number;
    b: number;
    a: number;
}
export interface FabricObject extends IObject {
    id?: string;
    memid?: string;
    stopFireEvent?: boolean;
    _textBeforeEdit?: string;
    memidList?: string[];
    operation?: string;
}
export declare type Role = 'audience' | 'host';
declare class FabricCanvas extends EventEmitter<FabricEvents> {
    private canvas;
    private currentShape;
    private drawingTool;
    private isDrawing;
    private drawingModeSave;
    private startX;
    private startY;
    private options;
    shapeColor: IColor;
    private images;
    private curImageIndex;
    private role;
    private memid;
    static setLogLevel(logLevel: LogLevel): void;
    stage: number;
    maxStep: number;
    historyList: {
        version: string;
        background?: string | Pattern;
        backgroundImage?: string | IImage;
        objects: IObject[];
    }[];
    inComingObjectMap: Map<string, FabricObject>;
    backgroundColor: string;
    /**
     * @param canvasId 必填，画布的dom id
     * @param role {'host' | 'audience'} 必填，角色 host | audience
     * @param memid 必填值，用户id
     * @param backgroundColor 可选值，画布背景颜色，推荐使用rgba格式
     */
    constructor(canvasId: string, role: Role | undefined, memid: string, backgroundColor?: string);
    getCanvas(): ICanvas;
    /**
     * @param memidList 可选值，清空某人的标注，不传则清空所有人的标注
     */
    clearCanvas(memidList?: string[]): number;
    setBackgroundColor(color: string): number;
    setBackgroundImage(imageUrl: string, options?: IImageOptions): void;
    addObject(object: FabricObject): number;
    private removeObjectFromAllHistory;
    removeObject(object: FabricObject): number;
    modifyObject(object: FabricObject): number;
    removeAllObject(): number;
    getObjects(): IObject[];
    getActiveObject(): IObject | undefined | null;
    setActiveObject(object: IObject): void;
    setWidth(value: number | string): void;
    setHeight(value: number | string): void;
    setDrawingTool(tool: DrawingTool): 0 | 400;
    setColorOpacity(): void;
    private parseRGBAtoObject;
    setPaintColor(color: string): void;
    setOptions(options: ShapeOptions): number;
    drawRect(options: IRectOptions): void;
    drawTriangle(options: ITriangleOptions): void;
    drawCircle(options: ICircleOptions): void;
    drawEllipse(options: IEllipseOptions): void;
    drawLine(x1: number, y1: number, x2: number, y2: number, options?: ILineOptions): void;
    drawArrow(x1: number, y1: number, x2: number, y2: number, options?: ILineOptions): void;
    drawDoubleArrow(x1: number, y1: number, x2: number, y2: number, options?: ILineOptions): void;
    drawPointer(x1: number, y1: number, x2: number, y2: number, options?: ILineOptions): void;
    drawDot(options?: ICircleOptions): void;
    drawFreeDraw(): void;
    drawText(text: string, options?: ITextOptions): void;
    insertImage(url: string, options?: IImageOptions): void;
    insertPPT(urls: string[]): number;
    setCurrentScense(index: number): number;
    eraser(): number;
    private setUUID;
    private initEvent;
    private onMouseDownBefore;
    private onMouseEnter;
    private onMouseOut;
    handleScale: (e: IEvent) => void;
    point1: Pointer;
    point2: Pointer;
    currentRatio: number;
    private getDistance;
    private onMouseDown;
    private createObject;
    private onMouseMove;
    private onMouseUp;
    private saveCurrentSnapshot;
    toDataURL(options?: ICanvasOptions): string;
    toJSON(): {
        version: string;
        objects: IObject[];
    };
    loadFromJSON(json: any, callback: Function, reviver?: Function): ICanvas;
    renderAll(): ICanvas;
    /**
     * 缩放（以画布中心点放大）
     * @param ratio 缩放比例（0~1）
     */
    zoom(ratio?: number): number;
    getZoom(): number;
    zoomIn(): void;
    zoomOut(): void;
    destroy(): void;
    undo(): 0 | undefined;
    private selectHistory;
    redo(): number;
    private renderCanvas;
    normalization(object: any): any;
    unNormalization: (object: any) => any;
    exportCanvas(): {
        inComingObjectMap: Map<any, any>;
        historylist: {
            version: string;
            background?: string | Pattern | undefined;
            backgroundImage?: string | IImage | undefined;
            objects: IObject[];
        }[];
        stage: number;
        drawingTool: DrawingTool;
        shapeColor: IColor;
        images: string[];
        curImageIndex: number;
        options: ShapeOptions;
        currentShape: FabricObject | undefined;
        isDrawingMode: boolean | undefined;
        freeDrawingCursor: string | undefined;
        canvasColor: string;
    };
    importCanvas(data: any): void;
}
export default FabricCanvas;