锚点(Endpoint)

用法

  1. // 用法一:
  2. canvas.draw({
  3.   nodes: [{
  4.     ...
  5.     endpoints: [{
  6.       id: 'point_1',
  7.       type: 'target',
  8.       orientation: [-1, 0],
  9.       pos: [0, 0.5]
  10.     }]
  11.   }]
  12. })
  14. // 用法二:
  15. let node = this.canvas.getNode('xxx');
  16. node.addEndpoint({
  17.   id: 'xxxx',
  18.   type: 'target',
  19.   dom: dom           // 使用此属性用户可以使用任意的一个dom作为一个锚点
  20. });

属性

key 说明 类型 默认值
id 节点唯一标识 string (Require) -
orientation 方向 array (Option) 下:[0,1]/上:[0,-1]/右:[1,0]/左:[-1,0]
pos 连接目标锚点id string (Option) -
scope 作用域 string (Option) 锚点scope相同才可以连线
type 目标锚点还是源锚点 string (Option) ‘source’ / ‘target’ / undefined，当undefined的时候锚点既是source又是target
disLinkable 禁止锚点拖动断开线段 boolean (Option) 该属性仅限用于’target’的锚点
root 可把锚点附属与某个子元素 string (Option) -
Class 拓展类 Class (Option) 当传入拓展类的时候，该节点组则会按拓展类的draw方法进行渲染，拓展类的相关方法也会覆盖父类的方法
dom 可以把此dom作为自定义锚点 dom (Option) -

方法

  1. /**
  2.   * @return {dom} - 自定义节点的dom
  3.   */
  4. draw = () => {}
  6. /**
  7.   * 锚点挂载后的回调
  8.   */
  9. mounted = () => {}
  11. /**
  12.   * 锚点更新后的回调
  13.   */
  14. updated = () => {}
  16. /**
  17.   * @param {number} x - 移动位置的x坐标 
  18.   * @param {number} y - 移动位置的y坐标 
  19.   */
  20. moveTo = (obj) => {}