锐客网

  1. 首页 > 睿知 > it技术 > >

三维拓扑元素介绍之TLink

前端

上一篇介绍了节点TNode，本篇介绍TLink，TLink表示连接关系。
TLink TLink表示两个节点之间的连接关系。它的构造如下：

let link = new eg.TLink(fromNode,toNode);

其中fromNode表示起始节点，toNode表示结束节点。
下面是简单的示例：
let node1 = new eg.TNode({image: "./images/convergence.png"}); node1.setName("node1"); node1.p(-200, 100, 0); let node2 = new eg.TNode({image: "./images/convergence.png"}); node2.setName("node2"); node2.p(200, -100, 0); let link = new eg.TLink(node1,node2); dataModel.add(node1); dataModel.add(node2); dataModel.add(link);

最终的显示效果如下图所示：
三维拓扑元素介绍之TLink
文章图片

连线的类型 连线默认是直线，通过指定连线类型，还可以构造其他形式的连线。 主要包括如下类型：
  • linear 默认类型 表示直线
  • orthogonal.x
  • orthogonal.x.n
  • orthogonal.y
  • orthogonal.y.n
  • orthogonal.z
  • orthogonal.z.n
  • flex.x
  • flex.x.n
  • flex.y
  • flex.y.n
  • flex.z
  • flex.z.n
通过setStyle可以指定连线的类型，代码如下所示：
link.setStyle("link.type","orthogonal.x");

其中orthogonal类型表示正交的连线类型，如下图所示，表示“orthogonal.x”：
三维拓扑元素介绍之TLink
文章图片

表示正交的效果，其中orthogonal.x 表示从头fromNode到toNode先沿着x方向，在沿着y方向，最后沿着z方向前进，orthogonal.x.n 表示从头fromNode到toNode先沿着x方向，在沿着z方向，最后沿着y方向前进.orthogonal.y表示从头fromNode到toNode先沿着y方向，在沿着z方向，最后沿着x方向前进。 依此类推。
flex类型也是正交的效果，不过先到两个节点的中心点。 如下图所示，表示“flex.x”:
三维拓扑元素介绍之TLink
文章图片

相关的规则和orthogonal系列类似。其中flex.x 表示从头fromNode到toNode先沿着x方向，在沿着y方向，最后沿着z方向前进，flex.x.n 表示从头fromNode到toNode先沿着x方向，在沿着z方向，最后沿着y方向前进.依此类推。
总结 本文介绍了TLink的构造方法，并介绍了TLink的各种类型。通过文中的各种类型，可以满足绝大多数的构造需要。
【三维拓扑元素介绍之TLink】欢迎关注公众号："图易可视化"。

    推荐阅读


    上一篇：Go 互斥锁 详解

    下一篇：前端周刊第十八期