You're Invited: Meet the Socket team at BSidesSF and RSAC - April 27 - May 1.RSVP →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

vizzu

Package Overview
Dependencies
Maintainers
3
Versions
44
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

vizzu

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 animat

0.16.2
latest
Source
npm
Version published
Maintainers
3
Created
Source

Vizzu

Vizzu - Library for animated data visualizations and data stories.

Documentation · Examples · Code reference · Repository · Blog

npm version install size Tweet

Vizzu

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:

<html>
 <head>
  <script type="module">
   import Vizzu from 'https://cdn.jsdelivr.net/npm/vizzu@0.16/dist/vizzu.min.js';
  </script>
 </head>
</html>

Usage

Create a placeholder element that will contain the rendered chart:

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

Create a simple bar chart:

import Vizzu from 'https://cdn.jsdelivr.net/npm/vizzu@0.16/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

FAQ

You can find answers to the most frequently asked questions about using the library in our FAQ.

Projects

List of external projects (extensions, bindings, templates, etc) for Vizzu: Projects.

Roadmap

We have a comprehensive list of features we plan to implement, on our Roadmap.

Contributing

We welcome contributions to the project, visit our contributing guide for further info.

Contact

License

Copyright © 2021-2024 Vizzu Inc.

Released under the Apache 2.0 License.

Keywords

chart
charts
dataviz
charting-library
dashboard
animation

FAQs

Package last updated on 03 Apr 2025

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

A New Design for GitHub PR Comments

Product

A New Design for GitHub PR Comments

We redesigned our GitHub PR comments to deliver clear, actionable security insights without adding noise to your workflow.

By André Staltz  -  Apr 10, 2025