Form Here：http://code.csdn.net/news/2819345

Vis.js 是一个动态的、基于浏览器的可视化库，可处理大量的动态数据并能与这些数据进行交互操作。该项目是由Almende B.V公司开发的，包含 DataSet、Timeline, 和 Graph。

Vis.js 是一个动态的、基于浏览器的可视化库，可处理大量的动态数据并能与这些数据进行交互操作。该项目是由Almende B.V公司开发的，包含 DataSet、Timeline和Graph组件。

Vis.js组件介绍：

  • 数据集（DataSet）：灵活的键/值。可添加、更新和删除项目。DataSet可以过滤和订制项目，转换项目领域。
  • 数据视图（DataView）：在DataSet过滤和/或格式化视图。
  • 图表（Graph）：显示图形或网络。
  • 时间轴（Timeline）：显示不同类型的时间轴上的数据。在时间轴上的时间和项可以交互移动、缩放及控制。

安装方式：

  • npm方式：npm install vis
  • bower方式: bower intall vis

或者前往官方站点下载该库文件。下载地址（版本0.7.2）

开源许可证：Apache License, Version 2.0

官方主页： http://visjs.org/

项目文档： http://visjs.org/docs/index.html

示例：

<!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>

可视化效果：

时间轴 基本用法

dataset

much data

html data

图表基本用法

random nodes

images

shapes

social network

groups

创意应用：社交网站朋友关系或者与您有关的人和事。

动态可视化库Vis.js：社交关系谱的更多相关文章

  1. Vis.js图表插件

    Vis.js是一款基于JavaScript的可视化图表库,Vis.js不像其他的图表库那样仅仅支持几种常用的数据图表,比如线形图.柱状图.饼图等,Vis.js支持上百种不同类型的可视化图表类型,比如时 ...

  2. Pycon 2017： Python可视化库大全

    本文首发于微信公众号“Python数据之道” 前言 本文主要摘录自 pycon 2017大会的一个演讲,同时结合自己的一些理解. pycon 2017的相关演讲主题是“The Python Visua ...

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

    Vis.js 是一个动态的,基于浏览器的可视化库.该库被设计为易于使用,能处理大量的动态数据.该库由以下几部分组成:一是数据集和数据视图,基于灵活的键/值数据集,可以添加,更新和删除项目,订阅数据集变 ...

  4. MOOC课程信息D3.js动态可视化

    版权声明:本文为博主原创文章,转载 请注明出处:https://blog.csdn.net/sc2079/article/details/83153693 - 写在前面 好久没更新博客了,主要还是最近 ...

  5. 日常英语---四、vis.js是什么

    日常英语---四.vis.js是什么 一.总结 一句话总结:A dynamic, browser based visualization library. 动态基于浏览器的可视库 http://vis ...

  6. Python可视化库

    转自小小蒲公英原文用Python可视化库 现如今大数据已人尽皆知,但在这个信息大爆炸的时代里,空有海量数据是无实际使用价值,更不要说帮助管理者进行业务决策.那么数据有什么价值呢?用什么样的手段才能把数 ...

  7. 动态可视化 数据可视化之魅D3,Processing,pandas数据分析,科学计算包Numpy,可视化包Matplotlib,Matlab语言可视化的工作,Matlab没有指针和引用是个大问题

    动态可视化 数据可视化之魅D3,Processing,pandas数据分析,科学计算包Numpy,可视化包Matplotlib,Matlab语言可视化的工作,Matlab没有指针和引用是个大问题 D3 ...

  8. vis.js绘图库的一个BUG以及源码修正

    1. BUG 1.1 BUG触发情况 在使用vis.js绘图时,加入两个节点A和B之间既存在一条从A指向B的边,同时也存在一条从B指向A的边,那么这个绘图库就会崩溃. 1.2 BUG解析 vis.js ...

  9. Bokeh 0.9.0dev 发布，交互式可视化库

    快速使用Romanysoft LAB的技术实现 HTML 开发Mac OS App,并销售到苹果应用商店中.   <HTML开发Mac OS App 视频教程> 土豆网同步更新:http: ...

随机推荐

  1. UNIX网络编程---TCP客户/服务器程序示例（五）

    一.概述 客户从标准输入读入一行文本,并写给服务器 服务器从网络输入读入这行文本,并回射给客户 客户从网络输入读入这行回射文本,并显示在标准输出上 二.TCP回射服务器程序:main函数 这里给了函数 ...

  2. JavaEE Tutorials (28) - Duke书店案例研究示例

    28.1Duke书店的设计和架构43828.2Duke书店接口439 28.2.1Book Java持久化API实体439 28.2.2Duke书店中使用的企业bean440 28.2.3Duke书店 ...

  3. web api\ protobuf \formatter

    9:50:20吴X2014/11/7 9:50:20 9:55:14吴X2014/11/7 9:55:14webapi实现protobuf吴X2014/11/7 9:56:29http://www.s ...

  4. UESTC_魔法少女小蟹 CDOJ 710

    小蟹是一名魔法少女,能熟练的施放很多魔法. 有一天魔法学院上课的时候出现了这样一道题,给一个6位数,让大家用自己的魔法,把这个6位数变成另一个给定的6位数. 小蟹翻了下魔法书,发现她有以下6种魔法: ...

  5. ZOJ 1136 Multiple (BFS）

    Multiple Time Limit: 10 Seconds      Memory Limit: 32768 KB a program that, given a natural number N ...

  6. mongoDb c driver

    1,yum dependencies Centos,RHEL Fedora: $ sudo yum install git gcc automake autoconf libtool Debian: ...

  7. 为什么学微信小程序开发

    微信小程序是什么? 触手可得,不用安装,不体验过自己是想不到的 ---张小龙 小程序是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或者搜 一下即可打开应用.也体现了“用 ...

  8. 工作记录8:iOS 传值问题总结（7种传值完美介绍）

    1.属性传值 前向后传值. 记住: /* 1: 属性传值第一步需要用到什么类型就定义什么样的属性 2: 从上一个页面到一个页面的选中方法里面将要传的值传到来(上一个页面)备注:这种方法只适用于上一个页 ...

  9. MVC学习 （二） Razor语法

    MVC的Model层我理解与三层架构的Molde没有区别,都是作为各个层之间的数据沟通桥梁.但是关于Control和View都有一些与传统webform不同的特性. 这里先学习View里所用到的Raz ...

  10. 关于.netFramework概述

    这几天学了不少东西,想来还是应该总结一下,一来自己回顾一下,二来也怕自己忘记,在文章中,有很多东西就是借鉴别人的blog,笔者在这里对他们的无私奉献表示感谢.笔者的语言组织能力有限,如果在文章中出现什 ...