@logicflow/extension/es/components/mini-map/index.d.ts

LogicFlow Extensions

import LogicFlow from '@logicflow/core';
import MiniMapPosition = MiniMap.MiniMapPosition;
export declare namespace MiniMap {
    type MiniMapOption = Partial<{
        /**
         * 小地图中画布的宽度
         */
        width: number;
        /**
         * 小地图中画布的高度
         */
        height: number;
        /**
         * 在小地图的画布中是否渲染边
         */
        showEdge: boolean;
        /**
         * 是否显示小地图的标题栏
         */
        isShowHeader: boolean;
        /**
         * 是否显示关闭按钮
         */
        isShowCloseIcon: boolean;
        /**
         * 小地图标题栏的文本内容
         */
        headerTitle: string;
        /**
         * 小地图与画布左边界的左边距，优先级高于`rightPosition`
         */
        leftPosition: number;
        /**
         * 小地图与画布右边界的右边距，优先级低于`leftPosition`
         */
        rightPosition: number;
        /**
         * 小地图与画布上边界的上边距，优先级高于`bottomPosition`
         */
        topPosition: number;
        /**
         * 小地图与画布下边界的下边距，优先级低于`topPosition`
         */
        bottomPosition: number;
    }>;
    type AbsolutePosition = Partial<Record<'left' | 'right' | 'top' | 'bottom', number>>;
    type MiniMapPosition = 'left-top' | 'right-top' | 'left-bottom' | 'right-bottom' | AbsolutePosition;
}
export declare class MiniMap {
    static pluginName: string;
    /**
     * 主画布的LogicFlow实例
     */
    private lf;
    /**
     * LogicFlow构造函数
     */
    private LFCtor;
    /**
     * 小地图中画布的LogicFlow实例
     */
    private lfMap;
    /**
     * lf的工具层容器，用于挂载小地图
     */
    private container?;
    /**
     * 小地图的容器
     */
    private miniMapContainer?;
    /**
     * 小地图的画布容器
     */
    private miniMapWrap;
    /**
     * 小地图的预览视窗
     */
    private viewport;
    /**
     * 小地图中画布容器的宽度
     */
    private width;
    /**
     * 小地图中画布容器的高度
     */
    private height;
    /**
     * 小地图中画布的缩放比例
     */
    private scale;
    /**
     * 小地图中画布的水平位移
     */
    private translateX;
    /**
     * 小地图中画布的垂直位移
     */
    private translateY;
    /**
     * 在小地图的画布中是否渲染边
     */
    private showEdge;
    /**
     * 小地图中画布的区域范围
     */
    private bounds;
    /**
     * 所有元素占领的区域范围
     */
    private elementAreaBounds;
    /**
     * 主画布视口的区域范围
     */
    private viewPortBounds;
    private leftPosition?;
    private topPosition?;
    private rightPosition?;
    private bottomPosition?;
    /**
     * 预览视窗左上角在主画布的y坐标
     */
    private viewPortTop;
    /**
     * 预览视窗左上角在主画布的x坐标
     */
    private viewPortLeft;
    private viewPortWidth;
    private viewPortHeight;
    /**
     * 拖拽预览视窗时，记录起始点的位置
     */
    private startPosition;
    /**
     * 是否显示小地图
     */
    private isShow;
    /**
     * 是否显示小地图的标题栏
     */
    private isShowHeader;
    /**
     * 是否显示关闭按钮
     */
    private isShowCloseIcon;
    /**
     * 小地图标题栏的文本内容
     */
    private headerTitle;
    /**
     * 小地图的logicFlow实例需要禁用的插件
     */
    private disabledPlugins;
    constructor({ lf, LogicFlow, options }: LogicFlow.IExtensionProps);
    onGraphResize: () => void;
    render: (_: LogicFlow, container: HTMLElement) => void;
    /**
     * 显示小地图
     * @param left 相对画布的左边距
     * @param top 相对画布的上边距
     */
    show: (left?: number, top?: number) => void;
    /**
     * 隐藏小地图
     */
    hide: () => void;
    /**
     * 更新小地图在画布中的位置
     * @param {MiniMapPosition} position
     */
    updatePosition: (position: MiniMapPosition) => void;
    /**
     * 重置主画布的缩放和平移
     */
    reset: () => void;
    /**
     * 设置小地图的画布中是否显示边
     * @param {boolean} showEdge
     */
    setShowEdge: (showEdge: boolean) => void;
    /**
     * 初始化小地图的配置
     * @param options
     */
    private setOption;
    /**
     * 初始化小地图的 LogicFlow 实例
     */
    private initMiniMap;
    private createMiniMap;
    private updateMiniMapPosition;
    private removeMiniMap;
    /**
     * 更新小地图的区域范围
     * @param data
     */
    private updateBounds;
    /**
     * 计算所有图形一起，占领的区域范围。
     * @param data
     */
    private updateElementAreaBounds;
    /**
     * 获取视口范围
     */
    private updateViewPortBounds;
    /**
     * 删除部分内容以简化渲染，包括边与节点文本
     */
    private resetData;
    /**
     * MiniMap视图重绘
     * @param reRender 是否重新渲染画布元素
     */
    private setView;
    /**
     * 更新预览视窗的位置
     */
    private updateViewPort;
    /**
     * 创建预览视窗元素
     */
    private createViewPort;
    private startDrag;
    /**
     * 拖拽预览视窗过程中，更新主画布视口
     */
    private drag;
    /**
     * 拖拽预览视窗结束，移除拖拽事件
     */
    private drop;
    /**
     * 点击小地图中非预览视窗的区域时，移动主画布视口聚焦于点击位置
     */
    private mapClick;
    destroy(): void;
}
export default MiniMap;