vis.js

最新推荐文章于 2024-08-18 09:42:56 发布

weixin_30868855

最新推荐文章于 2024-08-18 09:42:56 发布

阅读量140

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/boreguo/p/10748853.html

版权

1、官网：http://visjs.org/docs/network/

2、示例：

<!doctype html>
　　<html>
　　　　<head>
　　　　<title>vis.js</title>
　　　　<script type="text/javascript" src="vis.js"></script>
　　　　<link href="vis.css" rel="stylesheet" type="text/css" />
　　　　<style type="text/css">
　　　　　　#mynetwork {
　　　　　　width: 600px;
　　　　　　height: 400px;
　　　　　　border: 1px solid lightgray;
　　　　　　}
　　　　</style>
　　　　</head>
　　　　<body>
　　　　　　<div id="mynetwork"></div>

　　　　　　<script type="text/javascript">
　　　　　　// 创建节点数组
　　　　　　var nodes = new vis.DataSet([
　　　　　　　　{id: 1, label: 'Node 1'},
　　　　　　　　{id: 2, label: 'Node 2'},
　　　　　　　　{id: 3, label: 'Node 3'},
　　　　　　　　{id: 4, label: 'Node 4'},
　　　　　　　　{id: 5, label: 'Node 5'}
　　　　　　]);

　　　　　　// 创建关系数组
　　　　　　var edges = new vis.DataSet([
　　　　　　　　{from: 1, to: 3},
　　　　　　　　{from: 1, to: 2},
　　　　　　　　{from: 2, to: 4},
　　　　　　　　{from: 2, to: 5}
　　　　　　]);

　　　　　　// 创建一个网络
　　　　　　var container = document.getElementById('mynetwork');

　　　　　　// vis数据
　　　　　　var data = {
　　　　　　　　nodes: nodes,
　　　　　　　　edges: edges
　　　　　　};
　　　　　　var options = {};

　　　　　　// 初始化网络
　　　　　　var network = new vis.Network(container, data, options);
　　　　</script>
　　</body>
</html>

转载于:https://www.cnblogs.com/boreguo/p/10748853.html

weixin_30868855

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
vis.js

1、官网：http://visjs.org/docs/network/2、示例：<!doctype html>　　<html> 　　　　<head> 　　　　<title>vis.js</title> 　　　　<script type="text/javascript" src="vis.js"...
复制链接

扫一扫