ReactJS Data Visualization Library Based on D3.js

Data visualization library for React based on D3js

REAVIZ is a modular chart component library that leverages React natively for rendering the components while using D3js under the hood for calculations. The library provides an easy way to get started creating charts without sacrificing customization ability.

✨ Features

Chart types include:

Bar Chart
Line Chart
Area Chart
Pie Chart
Bubble Chart
Scatter Plot
Hive Plot
Sankey Chart
Map Chart
Sparklines

Additional features:

Legend
Tooltips
Animations Enter/Update/Exit
Advanced Axis Configuration
Brush
Panning / Zooming
Gestures
Grid/Mark Lines
BigInt Support

📦 Install

To use reaviz in your project, install it via npm/yarn:

npm i reaviz --save

then import a chart type into your JSX element:

import { BarChart } from "reaviz";

const data = [
  { key: 'IDS', data: 14 },
  { key: 'Malware', data: 5 },
  { key: 'DLP', data: 18 }
];

const App = () => <BarChart width={350} height={250} data={data} />;

Checkout this demo live or visit the demos page to learn more!

🔭 Development

If you want to run REAVIZ locally, its super easy!

Clone the repository
npm i
npm start
Browser opens to Storybook page

🚀 Quick Links

Checkout the demos and docs
Try it yourself on CodeSandbox
Learn about updates from the changelog

Download Details:

Author: bradvatne

Demo: https://jask-oss.github.io/reaviz/

Source Code: https://github.com/bradvatne/reaviz

#react #reactjs #javascript