/data-visualisation-dashbaord

A data-visualization dashboard

Primary LanguageJavaScript

Dashboard

A data-visualization dashboard.

Table of Content

General Info

This is a React app which utilises "Chart.js" to visualize data on the app. The app uses different types of graphs and charts viz. bar-grapph, line-graph and pie-chart to represent data fetched from custom REST API. The app also allows user to set different filters, and the charts changes respectively to reflect the filtered data.

Technologies

  • React
  • MaterialUI
  • Chart.js
  • React-Chartjs-2

Setup

To run the project locally

# clone this repository
git clone clone https://github.com/Tanishka-2000/data-visualisation-dashbaord.git

# go into the repository
cd data-visualisation-dashbaord

# install dependencies
npm install

# run the app
npm run dev

Demo

Here is the live working demo https://tanishka-data-visualisation-dashboard.netlify.app/

Please wait for 1 minute before data is visible in charts.

Features

  • Responsiveness
  • Dark/Light mode
  • Ability to filter data
  • Easy to understand data and charts

API

The custom API used for this project can be found on https://github.com/Tanishka-2000/data-visualisation-api