vue 集成jTopo 处理方法

时间：2019-08-07 10:28:55 阅读：350 评论：0 收藏：0 [点我收藏+]

jTopo 帮助说明网站

http://www.jtopo.com/index.html

使用例子：

http://www.jtopo.com/demo/helloworld.html

不建议直接安装 github 上的代码，因为代码版本不是最新，有部分功能未实现。

下载最新的js类库文件放到 vue 项目 public 文件夹下。

引入 import "/jtopo/jtopo-0.4.8-min.js";

<div>

</section>

</div>

</PanelBase>

</div>

</template>

let canvas = document.getElementById("canvas");

that.stage = new JTopo.Stage(canvas);

that.scene = new JTopo.Scene(that.stage);

that.scene.background = "/jtopo/aa.png";

let s1 = that.node("a1", 305, 43, "server.png");

s1.alarm = "2 W";

let s2 = that.node("a2", 365, 43, "server.png");

let s3 = that.node("a3", 425, 43, "server.png");

let g1 = that.node("a4", 366, 125, "gather.png");

that.linkNode(s1, g1, true);

that.linkNode(s2, g1, true);

that.linkNode(s3, g1, true);

let w1 = that.node("a5", 324, 167, "wanjet.png");

that.linkNode(g1, w1);

let c1 = that.node("a6", 364, 214, "center.png");

that.linkNode(w1, c1);

let cloud = that.node("a7", 344, 259, "cloud.png");

that.linkNode(c1, cloud);

let c2 = that.node("a8", 364, 328, "center.png");

that.linkNode(cloud, c2);

let w2 = that.node("a9", 324, 377, "wanjet.png");

that.linkNode(c2, w2);

linkNode(nodeA: number, nodeZ: number, f: boolean) {

/**连线*/

let link;

if (f) {

link = new JTopo.FoldLink(nodeA, nodeZ);

} else {

link = new JTopo.Link(nodeA, nodeZ);

}

link.direction = "vertical";

this.scene.add(link);

return link;

hostLink(nodeA: any, nodeZ: any, name: string) {

let link1 = new JTopo.FlexionalLink(nodeA, nodeZ, name);

//var link = new JTopo.FlexionalLink(nodeA, nodeZ, text);

//var link = new JTopo.FlexionalLink(nodeA, nodeZ, text);// 二次折线

link1.shadow = false;

link1.offsetGap = 44;

this.scene.add(link1);

return link1;

}

vue 集成jTopo 处理方法

原文：https://www.cnblogs.com/hucoke/p/11313480.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年09月23日 (328)
2021年09月24日 (313)
2021年09月17日 (191)
2021年09月15日 (369)
2021年09月16日 (411)
2021年09月13日 (439)
2021年09月11日 (398)
2021年09月12日 (393)
2021年09月10日 (160)
2021年09月08日 (222)