plugin-drawing-topology

拓扑路径绘制。

交互提示

鼠标左键单击连接一个点

鼠标右键单击或 delete | Backspace 键删除上一个点

鼠标左键双击或 return | Enter 键保存路径并结束绘制

esc 键清空路径并结束绘制

样例

安装

npm install @soonspacejs/plugin-drawing-topology -S
# or
yarn add @soonspacejs/plugin-drawing-topology -S

使用方法

import SoonSpace from 'soonspacejs';
import DrawingTopologyPlugin from '@soonspacejs/plugin-drawing-topology';

const ssp = new SoonSpace({
  el: '#view',
  options: {},
  events: {},
});

const drawingTopologyPlugin = ssp.registerPlugin(DrawingTopologyPlugin, 'drawTopologyPlugin');
consolo.log(drawingTopologyPlugin);

属性

drawing

是否正在绘制

用法

drawingTopologyPlugin.drawing;

方法

start

开始绘制拓扑路径

定义

export interface StartOptions extends TopologyInfo {
  onCancel?: () => void;
  onAdd?: (node: TopologyNodeInfo, intersectObject: Object3D) => void;
  onUndo?: (node: TopologyNodeInfo) => void;
  onDone?: (nodes: TopologyNodeInfo[], topology: Topology | null) => void;
}

function start(options: StartOptions): void;

用法

drawingTopologyPlugin.start({
  id: 'drawing_topology',
  onDone(nodes, topology) {
    console.log('drawEnd', nodes, topology);
  },
  onAdd(addNode, intersectObject) {
    console.log('add', addNode, intersectObject);
  },
  onUndo(undoNode) {
    console.log('undo', undoNode);
  },
  onCancel() {
    console.log('drawCancel');
  },
});

参数

options

• 描述: 配置
• 必填:
• 类型: StartOptions

StartOptions

属性	描述	类型	必填	默认值
onDone	绘制完成的回调函数	function(nodes: TopologyNodeInfo[], topology: Topology | null){}
onAdd	添加 node 回调函数	function(node: TopologyNodeInfo, intersectObject: Object3D){}
onUndo	撤销 node 回调函数	function(node: TopologyNodeInfo[]){}
onCancel	取消绘制的回调函数	function(){}

其他配置参考这里

undo

撤销上一次 node，触发 onUndo

定义

function undo(): void;

用法

drawingTopologyPlugin.undo();

done

完成本次绘制，触发 onDone

定义

function done(): void;

用法

drawingTopologyPlugin.done();

cancel

取消绘制，触发 onCancel

定义

function cancel(): void;

用法

drawingTopologyPlugin.cancel();