Popularity
2.6
Growing
Activity
9.8
-
675
7
17

Description

Vizzu is an open-source Javascript library designed to build animated charts with just a few lines of code. It has a generic dataviz engine that generates many types of charts and seamlessly animates between them. You can use it to create static charts, but it’s designed for building animated data stories and interactive explorers as Vizzu enables showing different perspectives of the data that the viewers can easily follow due to the animation.

Programming language: JavaScript
License: Apache License 2.0
Latest version: v0.3.3

Vizzu alternatives and similar libraries

Based on the "Animations" category.
Alternatively, view Vizzu alternatives based on common mentions on social networks and blogs.

Do you think we are missing an alternative of Vizzu or a related project?

Add another 'Animations' Library

README

Vizzu - Library for animated data visualizations and data stories. Tutorial & Examples · Reference · Repository

install size Tweet

About The Project

Vizzu is a free, open-source Javascript/C++ library utilizing a generic dataviz engine that generates many types of charts and seamlessly animates between them. It can be used to create static charts but more importantly it is designed for building animated data stories and interactive explorers as Vizzu enables showing different perspectives of the data that the viewers can easily follow due to the animation.

Main features:

  • Designed with animation in focus;
  • Defaults based on data visualization guidelines;
  • Automatic data aggregation & data filtering;
  • HTML5 canvas rendering;
  • Written in C++ compiled to WebAssembly;
  • Dependency-free.

Installation

Install via npm:

npm install vizzu

Or use it from CDN:

<script type="module">
import Vizzu from 'https://cdn.jsdelivr.net/npm/[email protected]/dist/vizzu.min.js';
</script>

Usage

Create a placeholder element that will contain the rendered chart:

<div id="myVizzu" style="width:800px; height:480px;"></div>

Create a simple bar chart:

import Vizzu from 'https://cdn.jsdelivr.net/npm/[email protected]/dist/vizzu.min.js';

let data = {
  series: [
    { name: 'Foo', values: ['Alice', 'Bob', 'Ted'] },
    { name: 'Bar', values: [15, 32, 12] },
    { name: 'Baz', values: [5, 3, 2] }
  ]
};

let chart = new Vizzu('myVizzu', { data });
chart.animate({
  x: 'Foo',
  y: 'Bar'
});

Then turn it into a scatter plot:

chart.animate({
  color: 'Foo',
  x: 'Baz', 
  geometry: 'circle' 
});

Try it!

Example chart

Contributing

We welcome contributions to the project, visit our wiki page for further info.

3rd Party Projects

List of external projects (plugins, templates, integrations) for Vizzu: [Projects](PROJECTS.md).

Contact

License

Copyright © 2021 Vizzu Kft..

Released under the [Apache 2.0 License](LICENSE).


*Note that all licence references and agreements mentioned in the Vizzu README section above are relevant to that project's source code only.