Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/react-financial/react-financial-charts
Charts dedicated to finance.
https://github.com/react-financial/react-financial-charts
canvas charts d3 financial react stockchart
Last synced: 7 days ago
JSON representation
Charts dedicated to finance.
- Host: GitHub
- URL: https://github.com/react-financial/react-financial-charts
- Owner: react-financial
- License: mit
- Created: 2019-09-06T17:12:09.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2024-03-09T05:25:39.000Z (11 months ago)
- Last Synced: 2025-01-12T07:02:14.832Z (14 days ago)
- Topics: canvas, charts, d3, financial, react, stockchart
- Language: TypeScript
- Homepage: https://react-financial.github.io/react-financial-charts/
- Size: 10.7 MB
- Stars: 1,260
- Watchers: 41
- Forks: 224
- Open Issues: 55
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Security: SECURITY.md
Awesome Lists containing this project
- awesome-fintech - react-financial-charts - charts dedicated to finance with multiple types, interactive indicators, overlays, and drawing objects (Charts)
README
# React Financial Charts
> **Note:** this repo is a fork of [react-stockcharts](https://github.com/rrag/react-stockcharts), renamed, converted to typescript and bug fixes applied due to the original project being unmaintained.
> **Note:** v1 is a fully breaking change with large parts, if not all, rewritten. Do not expect the same API! although the same features should exist.
[](https://codecov.io/gh/reactivemarkets/react-financial-charts)
[](https://github.com/react-financial/react-financial-charts/blob/master/LICENSE) [](https://www.npmjs.com/package/react-financial-charts)
Charts dedicated to finance.
The aim with this project is create financial charts that work out of the box.
## Features
- integrates multiple chart types
- technical indicators and overlays
- drawing objects
### Chart types
- Scatter
- Area
- Line
- Candlestick
- OHLC
- HeikenAshi
- Renko
- Kagi
- Point & Figure
### Indicators
- EMA, SMA, WMA, TMA
- Bollinger band
- SAR
- MACD
- RSI
- ATR
- Stochastic (fast, slow, full)
- ForceIndex
- ElderRay
- Elder Impulse
### Interactive Indicators
- Trendline
- Fibonacci Retracements
- Gann Fan
- Channel
- Linear regression channel
---
## Installation
```sh
npm install react-financial-charts
```
## Documentation
[Stories](https://react-financial.github.io/react-financial-charts/)
## Contributing
Refer to [CONTRIBUTING.md](./CONTRIBUTING.md)
This project is a mono-repo that uses [Lerna](https://lerna.js.org/) to manage dependencies between packages.
To get started run:
```bash
git clone https://github.com/react-financial/react-financial-charts.git
cd react-financial-charts
npm ci
npm run build
```
To start up a development server run:
```bash
npm start
```
## Roadmap
- [x] Convert to typescript
- [x] Bump dependencies to latest
- [x] Remove React 16 warnings
- [x] Add CI
- [x] Fix passive scrolling issues
- [x] Implement PRs from react-stockcharts
- [x] Add all typings
- [x] Move examples to storybook
- [x] Add all series' to storybook
- [x] Split project into multiple packages
- [x] Fix issues with empty datasets
- [x] Correct all class props
- [x] Migrate to new React Context API
- [x] Remove all UNSAFE methods
- [ ] Add documentation to storybook
- [ ] Add full test suite
## LICENSE
[](https://app.fossa.com/projects/custom%2B13613%2Fgit%40github.com%3Areactivemarkets%2Freact-financial-charts.git?ref=badge_large)