关于前端:三维拓扑元素介绍之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);

最终的显示成果如下图所示：

连线的类型

连线默认是直线，通过指定连线类型，还能够结构其余模式的连线。次要包含如下类型：

• 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”：

示意正交的成果，其中 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”:

相干的规定和 orthogonal 系列相似。其中 flex.x 示意从头 fromNode 到 toNode 先沿着 x 方向，在沿着 y 方向，最初沿着 z 方向后退，flex.x.n 示意从头 fromNode 到 toNode 先沿着 x 方向，在沿着 z 方向，最初沿着 y 方向后退. 依此类推。

总结

本文介绍了 TLink 的构造方法，并介绍了 TLink 的各种类型。通过文中的各种类型，能够满足绝大多数的结构须要。

欢送关注公众号：” 图易可视化 ”。