Awesome vis.js

A curated list around vis.js

Feel free to add to the list!!. If you think this is helpful Please give a Star ★.

Resources

• https://www.visjs.org
• visjs@npm

CDNs

• vis.js via cdnjs
• vis.js via unpkg

Documentation & Help

• vis-data documentation
• StackOverflow - vis.js questions & answers

Libraries

• vis-network - Display dynamic, automatically organised, customizable network views.
• vis-timeline - Create a fully customizable, interactive timelines and 2d-graphs with items and ranges.
• vis-graph3d - Create interactive, animated 3d graphs. Surfaces, lines, dots and block styling out of the box.
• vis-data - Manage unstructured data using DataSet. Add, update, and remove data, and listen for changes in the data.

vis.js based libraries

Add-Ons

• timeline-arrows - Class to easily draw lines to connect items in the vis Timeline module.

Vue

• vue-visjs - Vue2 component that helps with Visjs interaction.
• vue-vis-network - Integrate vis Network module to your Vue 2 application do draw network diagrams.
• vue2vis - Vue2 component that helps with Visjs interaction [Deprecated]

React

• react-graph3d-vis - A react component to create interactive 3d graphs.
• react-graph-vis - A react component to render NETWORK graphs.

AngularJS

• angular-visjs - AngularJS directive module for vis.js components.

Angular

• timeline-dep-graph - Interavtive Angular-based library to visualize tasks’ hierarchies and dependencies.
• ngx-vis - An angular 5+ vis.js project.

Misc

• vis.js Drupal integration
• vaadin vis.js component
• CHAP Links - The vis.js predecessor library.
• bespoke-vis - Use visjs to include timelines in your bespoke.js presentation.
• visNetwork - R package, using vis.js library for network visualization
• neovis.js - Graph visualizations powered by vis.js with data from Neo4j.

Blogposts & Tutorials

• 2018-08-19, vis.js Network Examples
• 2018-04-18, Graph Visualization With Neo4j Using Neovis.js
• 2014-09-14, vis.js - based on JavaScript dynamic visualization library browser
• 2014-05-26, Creating Network Diagrams With vis.js

Misc

• @visjs twitter account [Not updated anymore]

Alternatives

Timeline

• Ruimdetijd/timeline - Slime timeline component
• KronoGraph - Commercial tool by CambridgeIntelligence.

Network

• sigmajs.org
• amcharts force-directed-network
• js.cytoscape.org
• jsnetworkx.org

Showcases

Timeline

• https://agyletime.com/

Network

• Plunker - vis.js HTML overlay demo

Star Citizen Route Planner

https://starcitizen.center/route-planner

This interactive route planner and map for the SciFi Universe StarCitize makes use of graph features such as physics enabled on links, manual persistent positions for the nodes (user can make custom layouts), and custom icons based on the logic.

Mininet Editor

https://thomaash.github.io/me/

SDN topology editor in your web browser with Mininet, image and addressing plan export.

Skyebridge

https://github.com/emsk/skyebridge

Flow diagram generator

Misc

Contributing

See the Contribution Guide for details on how to contribute.

Code of Conduct

See the Code of Conduct for details. Basically, it comes down to:

In the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to making participation in our project and our community a harassment-free experience for everyone, regardless of age, body size, disability, ethnicity, gender identity and expression, level of experience, nationality, personal appearance, race, religion, or sexual identity and orientation.

License

This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License. License holders are all contributors.