from Hacker News

Ask HN: What's the best charting library for customer-facing dashboards?

by rogansage on 4/29/24, 11:13 AM with 60 comments

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?

  • by kfor on 4/29/24, 2:52 PM

    I like Vega-Lite: https://vega.github.io/vega-lite/

    It’s built by folks from the same lab as D3, but designed as “a higher-level visual specification language on top of D3” [https://vega.github.io/vega/about/vega-and-d3/]

    My favorite way to prototype a dashboard is to use Streamlit to lay things out and serve it and then use Altair [https://altair-viz.github.io/] 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.

  • by snide on 4/29/24, 12:18 PM

    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.

    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".

  • by ushercakes on 4/29/24, 2:50 PM

    https://www.chartjs.org/

    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.

  • by beingflo on 4/29/24, 12:58 PM

    I really enjoy using Observable Plot (https://observablehq.com/plot/). Made by the author of D3 but way simpler to use.

  • by anchen976 on 4/29/24, 1:38 PM

    We use highcharts to power most of our charting (we're an embedded analytics platform) and switched over from from chart.js

    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.

  • by xbpx on 4/29/24, 10:37 PM

    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).

    If you start plotting a lot of data it can grow with you since it supports typed arrays and webgl rendering without undue boilerplate.

    Disclaimer... I work for Plotly

  • by tomjakubowski on 4/29/24, 5:26 PM

    Try Perspective, especially if you want users to be able to interact with the visualizations and update them - including re-aggregating the data https://perspective.finos.org/

  • by siamese_puff on 4/29/24, 3:21 PM

    As someone who has recently been deep diving D3 for fun, I will give you my opinion.

    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)

    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.

    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.

    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

  • by TN1ck on 4/29/24, 10:19 PM

    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.

    We use them for all our charting needs (quite a bit!) at re-cap.com.

  • by pzo on 4/29/24, 4:47 PM

    Another alternative - I haven't tried this but bookmarked that one:

    https://nivo.rocks (https://github.com/plouc/nivo)

  • by MattSWilliamson on 5/2/24, 5:39 AM

    I'd recommend Vizzly: https://www.vizzly.co.

    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.

    The backend query engine is also pretty powerful; performant and copes well with complex customer data structures.

  • by jareklupinski on 4/29/24, 2:48 PM

    Whichever one looks best with the rest of your dashboard :)

    unless you specifically need to handle >100(0) data points, then only uplot or charts js will be performant (for free)

  • by marban on 4/29/24, 2:56 PM

  • by joewils on 4/29/24, 2:58 PM

    If print friendly reports are a requirement, I'd go with QuickChart (https://quickchart.io.)

    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.

  • by justincarter on 4/29/24, 3:10 PM

    I have used d3 for a few years now and with ChatGPT I find it at least 50% easier to set it up and troubleshoot issues.

  • by farseer on 4/30/24, 12:08 PM

    If you have millions of data points and require real time performance then go for a paid solution like SciChart: https://www.scichart.com/

  • by nickzelei on 4/29/24, 3:53 PM

    Chartjs looks great, but I've never used it so can't recommend personally. I've used https://recharts.org a lot with success.

  • by hughess on 4/29/24, 5:29 PM

    We use echarts at https://evidence.dev and have been quite happy with it. We do a lot of embedded analytics and it's worked well for us.

  • by tommiegannert on 4/29/24, 6:43 PM

    Plotly is based on D3. Has both open-source version and paid option.

    https://plotly.com/javascript/

  • by itomato on 4/29/24, 4:44 PM

    Shout out to rrdtool if your criteria for best includes maturity

  • by sprash on 4/29/24, 3:09 PM

    Not powerful but extremely simple, especially if you want to avoid JavaScript at all cost:

    https://chartscss.org

  • by ilamparithi on 4/30/24, 5:06 PM

    I used Apex Charts recently with VueJS. Happy with the exhaustive configuration options available for each charts. It worked well for my use case.

  • by klysm on 4/29/24, 4:31 PM

    ECharts is pretty good

  • by champdebloom on 4/29/24, 1:01 PM

    If you're using react, I really like Tremor: https://www.tremor.so/

  • by ciscoriordan on 4/29/24, 2:48 PM

    AG Charts is in a simple/powerful sweet spot.

  • by pob944 on 5/2/24, 8:43 PM

  • by ok1984 on 4/29/24, 11:46 AM

    Did you consider Fusion Charts?

  • by slake on 4/30/24, 3:23 AM

    Apache Echarts. You run into constraints with most others after a point.

  • by devolymp on 4/29/24, 4:49 PM

    We used Recharts to build our own opinionated charts at tremor.so

  • by gear54rus on 4/29/24, 3:20 PM

    c3 is another built-on-top-of-d3 thingie: https://c3js.org/examples.html

  • by PaywallBuster on 4/29/24, 2:51 PM

    what's the closest you can get to Grafana like looking?

  • by _boffin_ on 4/29/24, 3:16 PM

    There are a lot of fantastic libraries out there that can work. Best? How do you define that?

  • by url00 on 4/29/24, 3:13 PM

    Honestly, ChatGPT + D3 has been great for me. But YMMV of course.