Vis.js – 基于浏览器的动态 JavaScript 可视化库

  Vis.js 是一个动态的,基于浏览器的可视化库。该库被设计为易于使用,能处理大量的动态数据。该库由以下几部分组成:一是数据集和数据视图,基于灵活的键/值数据集,可以添加,更新和删除项目,订阅数据集变化;二是时间轴,用于显示不同类型的时间轴数据,在时间轴上项目可以交互移动,缩放和操纵;三是图形,使用节点和边显示一个交互式图形或网络。

  

Vis.js – 基于浏览器的动态 JavaScript 可视化库

 

  时间轴效果可以看这里的 Demo,示例代码如下:

<!doctype html>  <html>  <head>    <title>Timeline | Basic demo</title>    <script src="http://visjs.org/dist/vis.js"></script>    <link href="http://visjs.org/dist/vis.css" rel="stylesheet" type="text/css" />      <style type="text/css">      body, html {        font-family: sans-serif;      }    </style>  </head>  <body>  <div id="mytimeline"></div>    <script type="text/javascript">    var container = document.getElementById('mytimeline');    var data = [      {id: 1, content: 'item 1', start: '2013-04-20'},      {id: 2, content: 'item 2', start: '2013-04-14'},      {id: 3, content: 'item 3', start: '2013-04-18'},      {id: 4, content: 'item 4', start: '2013-04-16', end: '2013-04-19'},      {id: 5, content: 'item 5', start: '2013-04-25'},      {id: 6, content: 'item 6', start: '2013-04-27'}    ];    var options = {};    var timeline = new vis.Timeline(container, data, options);  </script>  </body>  </html>  

  

立即下载      插件主页

 

 

本文链接:Vis.js – 基于浏览器的动态 JavaScript 可视化库

编译来源:前端里 ◆ 关注前端开发技术 ◆ 分享网页设计资源

赞 (0) 打赏

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏