Done some research and think chart.js seems like a great option. D3 seems powerful but might be complicated. Looking for simple + powerful, but maybe these are mutually exclusive... any advice?
I like Vega-Lite: <a href="https://vega.github.io/vega-lite/" rel="nofollow">https://vega.github.io/vega-lite/</a><p>It’s built by folks from the same lab as D3, but designed as “a higher-level visual specification language on top of D3” [<a href="https://vega.github.io/vega/about/vega-and-d3/" rel="nofollow">https://vega.github.io/vega/about/vega-and-d3/</a>]<p>My favorite way to prototype a dashboard is to use Streamlit to lay things out and serve it and then use Altair [<a href="https://altair-viz.github.io/" rel="nofollow">https://altair-viz.github.io/</a>] to generate the Vega-Lite plots in Python. Then if you need to move to something besides Python to productionize, you can produce the same Vega-Lite definitions using the framework of your choice.
I've messed with a few. I really like Apache Echarts if you're looking for an all-in-one-can-do-anything solution with a good license. The downsides are that the docs can sometimes be a little obtuse. There are adapters for almost every front-end at this point.<p>Nivo is a much simpler system that is styled by default and works much easier with React. If you're not doing complicated charts, it's my goto for the "I just want a nice line/pie/bar chart".
<a href="https://www.chartjs.org/" rel="nofollow">https://www.chartjs.org/</a><p>It's pretty easy to configure and understand. It's the 80/20 principal of charts, it is 80% of D3 functionality for 20% the effort.
I really enjoy using Observable Plot (<a href="https://observablehq.com/plot/" rel="nofollow">https://observablehq.com/plot/</a>). Made by the author of D3 but way simpler to use.
We use highcharts to power most of our charting (we're an embedded analytics platform) and switched over from from chart.js<p>It's fairly powerful but also looks more polished out of the box. Some limitations on styling but that depends on your application/use case.
Plotly offers more power and flexibility than chart.js and provides a much simpler API than D3 (it has D3 and webgl renderers).
The ecosystem is broad and includes React, Angular and other wrappers and language-interfaces for Python, Rust, Go, Scala and many others (incl Common Lisp).<p>If you start plotting a lot of data it can grow with you since it supports typed arrays and webgl rendering without undue boilerplate.<p>Disclaimer... I work for Plotly
Try Perspective, especially if you want users to be able to interact with the visualizations and update them - including re-aggregating the data <a href="https://perspective.finos.org/" rel="nofollow">https://perspective.finos.org/</a>
As someone who has recently been deep diving D3 for fun, I will give you my opinion.<p>D3 is the king of data visualization written by Mike Bostock, a creative comp sci dude with incredible data viz and programming skills (love ya Mike)<p>The initial learning curve is kinda steep, but in reality it’s actually a really logical setup, you just need to build a few mental models. Without a doubt, I would pick D3. Top charting libs use D3 under the hood. It’s so god damn flexible you can build whatever you want.<p>Study d3indepth.com for a couple weeks, write a lot of code and watch some YouTube videos. The books are usually meh on this subject and outdated. Mike started Observable to make this passion of his profitable. It’s like Jupiter notebooks for visualizations using D3.<p>I’ve been wanting to write more and use visualizations to strengthen my writing and I’m picking a mix of D3 and standard JS/HTML to do it. Very satisfying
If you need really custom charts and use react, I can recommend Visx. It’s a small wrapper around d3, that doesn’t really try to create their own abstractions, but mostly uses d3 conventions.<p>We use them for all our charting needs (quite a bit!) at re-cap.com.
Another alternative - I haven't tried this but bookmarked that one:<p><a href="https://nivo.rocks" rel="nofollow">https://nivo.rocks</a> (<a href="https://github.com/plouc/nivo">https://github.com/plouc/nivo</a>)
I'd recommend Vizzly: <a href="https://www.vizzly.co">https://www.vizzly.co</a>.<p>It's a low-code solution for customer-facing analytics but is super flexible and extensible with code. Embedding is available in React or Vanilla JS (no iFrames). You can build dashboards programmatically or with the no-code editor.<p>The backend query engine is also pretty powerful; performant and copes well with complex customer data structures.
Whichever one looks best with the rest of your dashboard :)<p>unless you specifically need to handle >100(0) data points, then only uplot or charts js will be performant (for free)
If print friendly reports are a requirement, I'd go with QuickChart (<a href="https://quickchart.io" rel="nofollow">https://quickchart.io</a>.)<p>Static charts similar to chart.js, but without all the javascript. I've found static charts are much easier to work with once print CSS layout becomes a requirement.
If you have millions of data points and require real time performance then go for a paid solution like SciChart: <a href="https://www.scichart.com/" rel="nofollow">https://www.scichart.com/</a>
Chartjs looks great, but I've never used it so can't recommend personally. I've used <a href="https://recharts.org" rel="nofollow">https://recharts.org</a> a lot with success.
We use echarts at <a href="https://evidence.dev">https://evidence.dev</a> and have been quite happy with it. We do a lot of embedded analytics and it's worked well for us.
Plotly is based on D3. Has both open-source version and paid option.<p><a href="https://plotly.com/javascript/" rel="nofollow">https://plotly.com/javascript/</a>
Not powerful but extremely simple, especially if you want to avoid JavaScript at all cost:<p><a href="https://chartscss.org" rel="nofollow">https://chartscss.org</a>
c3 is another built-on-top-of-d3 thingie: <a href="https://c3js.org/examples.html" rel="nofollow">https://c3js.org/examples.html</a>