Britecharts React

Britecharts-react is a React wrapper for the Britecharts charting library. It allows the use of Britecharts charts within a React application.
Alternatives To Britecharts React
Project NameStarsDownloadsRepos Using ThisPackages Using ThisMost Recent CommitTotal ReleasesLatest ReleaseOpen IssuesLicenseLanguage
Chart.js61,9299392 days ago95July 26, 2023310mitJavaScript
Simple HTML5 Charts using the <canvas> tag
Echarts56,43942 days ago12January 27, 20212,383apache-2.0TypeScript
Apache ECharts is a powerful, interactive charting and data visualization library for browser
Plotly.js15,9997182472 days ago239July 25, 20231,502mitJavaScript
Open-source JavaScript charting library behind Plotly and Dash
Nvd37,187933926 months ago18August 24, 2017568otherJavaScript
A reusable charting library written in d3.js
Lightweight Charts6,91664320 hours ago31March 21, 2023100apache-2.0TypeScript
Performant financial charts built with HTML5 canvas
Chartkick6,1592,936535 days ago74July 24, 20236mitRuby
Create beautiful JavaScript charts with one line of Ruby
Bizcharts6,0156166847 months ago238November 30, 2022333mitTypeScript
Powerful data visualization library based on G2 and React.
Awesome D34,945
9 months ago3other
A list of D3 libraries, plugins and utilities
Ngx Charts4,2481,1033656 days ago89June 14, 2023808mitTypeScript
:bar_chart: Declarative Charting Framework for Angular
1115 years ago77September 30, 201710otherObjective-C
iOS-based charting library for both line and bar graphs.
Alternatives To Britecharts React
Select To Compare

Alternative Project Comparisons

Britecharts React

Britecharts-react is a React wrapper for the Britecharts charting library.

Build Status npm version License PRs Welcome All Contributors Twitter Follow

Stacked Area Chart Bar Chart Line Chart
Donut Chart Legend Tooltip
Sparkline Chart


Import components from Britecharts-React:

//ES6 import syntax
import { StackedArea } from 'britecharts-react';

//CommonJS require syntax
const { StackedArea } = require('britecharts-react');

Britecharts-React components are used just like any other stateless React component. You will pass in some props, and it would render a chart:



Each component's API will be a reflection of Britecharts charts and their APIs. That way, if we need to render a bar chart, we will first check the bar chart's API in the main project API reference page. You can read more about the approach here

From there, we will proceed to pass each of the configurations through the usual props as we do in React projects:


The complete set of components is in progress; the following components are currently implemented and available for use:

The following components haven't been migrated yet from Britecharts:

  • Brush charts
  • Heatmaps
  • Mini Tooltips
  • Scatter Plots

If you need to use one of the missing charts, check out our how-to guide for creating new charts.


Britecharts-React is available as an NPM module or through CDN links (in different formats or a bundle).

You can also use individual bundles in UMD format (dist/umd/), CommonJS format (lib/cjs), and tree-shaking-enabling ES2015 modules (lib/esm) to add to your bundle. You can see more on our test project.

Developers also need to load the stylesheets located in dist/britecharts-react.min.css to style the charts correctly.

Next steps

We are accepting PRs for creating wrappers for Britecharts components. Check our contributing guide, drop by the #britecharts channel in the d3 slack, or create an issue if you want to know more.


For this project, we have followed the approach called ‘Mapping Lifecycle methods’ based on Nicholas Hery's article. We want to recognize all the contributors in the parent project Britecharts.

See Also


Copyright 2017 Eventbrite

Licensed under the Apache License, Version 2.0 (the “License”); you may not use this file except in compliance with the License. You may obtain a copy of the License at

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an “AS IS” BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

Read more in the license document.


Thanks goes to these wonderful people (emoji key):

David Gómez
David Gómez

💻 🤔 🚧 👀

This project follows the all-contributors specification. Contributions of any kind welcome!

Popular Charting Projects
Popular Chart Projects
Popular User Interface Components Categories
Related Searches

Get A Weekly Email With Trending Projects For These Categories
No Spam. Unsubscribe easily at any time.
Data Visualization