Skip to main content


👋 Welcome to Unovis

This documentation will help you to get comfortable with Unovis — a modular and framework-independent library for charts, maps and network graphs.

🏗 Install

Unovis is available on NPM in several packages, each for the UI framework of your choice (React, Angular, Svelte or Vue). The core package @unovis/ts can be used without a UI framework, and if you use one you'll need to install @unovis/ts along with the framework specific package:

npm install -P @unovis/ts @unovis/react

If you use TypeScript, you'll need to enable the allowSyntheticDefaultImports option in the compilerOptions section of your tsconfig.json, because some of Unovis's dependencies need it.

Also if you have types specified in tsconfig.json explicitly, you might need to add "topojson-client" to the list. Otherwise, the TypeScript compiler won't find the required TopoJSON types.

🧑‍💻 Create your first chart

Most of Unovis components require a Container to get rendered. There are two types of containers available:

Some of the components are stand-alone and don't need a container: LeafletMap, LeafletFlowMap and legends.

Go to the 👟 Quick Start section to learn how to quickly build a simple Line Chart.

🔭 Explore the docs

Pick a component from the sidebar to learn how to configure it. Start with 📈 Line or 📊 Bar if you want something simple. Don't forget to check out our 🖼 Gallery to see what the library is capable of!