https://github.com/sayan-maity/d3-chart

Stock Data Chart of Google Company using D3.js
https://github.com/sayan-maity/d3-chart

d3-js react-js recharts-js

Last synced: about 22 hours ago
JSON representation

Stock Data Chart of Google Company using D3.js

• Host: GitHub
• URL: https://github.com/sayan-maity/d3-chart
• Owner: Sayan-Maity
• Created: 2024-07-19T17:16:46.000Z (2 months ago)
• Default Branch: main
• Last Pushed: 2024-07-19T18:24:39.000Z (2 months ago)
• Last Synced: 2024-09-24T02:08:42.225Z (4 days ago)
• Topics: d3-js, react-js, recharts-js
• Language: JavaScript
• Homepage: https://d3-chart-sayancr777.vercel.app/
• Size: 131 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# D3.js Stock Data Chart

This is a simple D3.js chart that displays stock data. The data is loaded from an API and displayed as a area and bar chart. The chart also includes a tooltip that displays the stock price when the user hovers over the data points.



  



## Tech Stack Used

- React

- D3.js

- Rechart

- Financial Modelling Prep API (for Stock Data)

## Features

- Fetches stock data from the API

- Used D3.js and Recharts to display the stock data

- Can change the stock data time range (1D, 1W, 1M, 3M, 1Y, 5Y)

- Displays the stock data as a area (close price) and bar chart (volumes)

- CrossHair to display the stock price according to dates when the user hovers over chart

- Tooltip to display the current stock price 

## Installation

- Clone the repository

- Run `npm install` to install the dependencies

- Run `npm run dev` to start the development server