@logicflow/extension/lib/tools/snapshot/index.d.ts

LogicFlow Extensions

import LogicFlow from '@logicflow/core';
export type ToImageOptions = {
    /**
     * 导出图片的格式，可选值为：`png`、`webp`、`jpeg`、`svg`，默认值为 `png`
     */
    fileType?: string;
    /**
     * 导出图片的宽度，通常无需设置，设置后可能会拉伸图形
     */
    width?: number;
    /**
     * 导出图片的高度，通常无需设置，设置后可能会拉伸图形
     */
    height?: number;
    /**
     * 导出图片的背景色，默认为透明
     */
    backgroundColor?: string;
    /**
     * 导出图片的质量。
     *
     * 在指定图片格式为 `jpeg` 或 `webp` 的情况下，可以从 0 到 1 的区间内选择图片的质量，如果超出取值范围，将会使用默认值 0.92。导出为其他格式的图片时，该参数会被忽略。
     */
    quality?: number;
    /**
     * 导出图片的内边距，即元素内容所在区域边界与图片边界的距离，单位为像素，默认为 40
     */
    padding?: number;
    /**
     * 导出图片时是否开启局部渲染
     * - `false`：将导出画布上所有的元素
     * - `true`：只导出画面区域内的可见元素
     */
    partial?: boolean;
};
export type SnapshotResponse = {
    data: Blob | string;
    width: number;
    height: number;
};
/**
 * 快照插件，生成视图
 */
export declare class Snapshot {
    static pluginName: string;
    lf: LogicFlow;
    offsetX?: number;
    offsetY?: number;
    fileName?: string;
    customCssRules: string;
    useGlobalRules: boolean;
    constructor({ lf }: {
        lf: any;
    });
    /**
     * 获取svgRoot对象dom: 画布元素（不包含grid背景）
     * @param lf
     * @returns
     */
    private getSvgRootElement;
    /**
     * 通过 imgUrl 下载图片
     * @param imgUrl
     */
    private triggerDownload;
    /**
     * 删除锚点
     * @param element
     */
    private removeAnchor;
    /**
     * 删除旋转按钮
     * @param element
     */
    private removeRotateControl;
    /**
     * 将图片转换为base64格式
     * @param url - 图片URL
     * @returns Promise<string> - base64字符串
     */
    private convertImageToBase64;
    /**
     * 检查URL是否为相对路径
     * @param url - 要检查的URL
     * @returns boolean - 是否为相对路径
     */
    private isRelativePath;
    /**
     * 处理SVG中的图片元素
     * @param element - SVG元素
     */
    private processImages;
    /**
     * 克隆并处理画布节点
     * @param svg
     * @returns
     */
    private cloneSvg;
    /**
     * 获取脚本 css 样式
     * @returns
     */
    private getClassRules;
    /**
     * 根据浏览器类型获取Canvas尺寸限制
     * @returns 包含最大主维度和次维度的对象
     */
    private getCanvasDimensionsByBrowser;
    /**
     * 将 svg 转化为 canvas
     * @param svg - svg 元素
     * @param toImageOptions - 图像选项
     * @returns Promise<canvas> - 返回 canvas 对象
     */
    private getCanvasData;
    /**
     * 封装导出前的通用处理逻辑：局部渲染模式处理、静默模式处理
     * @param callback 实际执行的导出操作回调函数
     * @param toImageOptions 导出图片选项
     * @returns 返回回调函数的执行结果
     */
    private withExportPreparation;
    /**
     * 导出画布：导出前的处理画布工作，局部渲染模式处理、静默模式处理
     * @param fileName
     * @param toImageOptions
     */
    getSnapshot(fileName?: string, toImageOptions?: ToImageOptions): Promise<void>;
    /**
     * 下载图片
     * @param fileName
     * @param toImageOptions
     */
    private snapshot;
    /**
     * 获取Blob对象
     * @param fileType
     * @param toImageOptions
     * @returns
     */
    getSnapshotBlob(backgroundColor?: string, fileType?: string, toImageOptions?: ToImageOptions): Promise<SnapshotResponse>;
    private snapshotBlob;
    /**
     * 获取base64对象
     * @param backgroundColor
     * @param fileType
     * @param toImageOptions
     * @returns
     */
    getSnapshotBase64(backgroundColor?: string, fileType?: string, toImageOptions?: ToImageOptions): Promise<SnapshotResponse>;
    private _getSnapshotBase64;
}
export default Snapshot;