Apache ECharts

We&#x27;ve tested almost every visualization library under the sun when building Briefer (<a href="https:&#x2F;&#x2F;briefer.cloud">https:&#x2F;&#x2F;briefer.cloud</a>) and I can confidently say that Apache ECharts is the best.<p>The main issues with other libraries is that they&#x27;re either:<p>(a) ugly (b) difficult to use (i.e. having to do things imperatively) (c) not flexible enough<p>Apache ECharts solve these 3 problems. It&#x27;s pretty by default, it allows us to mount&#x2F;calculate the declarative spec for the graphs in the back-end and then only send the desired spec to the front-end so it can render, and it&#x27;s also extremely flexible to the point we can support everything that traditional BI tools can do.<p>We&#x27;ve never had to extend the lib to do anything new, everything we need is already there.<p>Glad to see this great piece of work on top of HN.

I&#x27;ll toss some props to `go-echarts` [1], which allows you to declare charts with Golang types and it all gets bound to JSON automagically by Golang&#x27;s JSON marshaller. I&#x27;ve used it for many projects and whenever there&#x27;s an issue&#x2F;PR, the maintainer responds quickly.<p>It&#x27;s fun to Go-embed JavaScript functions and SQL queries, for this weird blend of data, SQL, Go and Javascript. Here&#x27;s a Golang example that pulls data from a DuckDB and creates a baked-in candlestick chart file with JavaScript tooltips. [2]<p>[1] <a href="https:&#x2F;&#x2F;github.com&#x2F;go-echarts&#x2F;go-echarts">https:&#x2F;&#x2F;github.com&#x2F;go-echarts&#x2F;go-echarts</a><p>[2] <a href="https:&#x2F;&#x2F;github.com&#x2F;NimbleMarkets&#x2F;dbn-duckduck-goose&#x2F;blob&#x2F;main&#x2F;handlers&#x2F;get_charts.go#L207">https:&#x2F;&#x2F;github.com&#x2F;NimbleMarkets&#x2F;dbn-duckduck-goose&#x2F;blob&#x2F;mai...</a>

ECharts is in my opinion the best out there. It surprisingly doesn&#x27;t come up in a lot of lists or search for charting libraries. I&#x27;ve tried them all: chart.js, google charts, amCharts, Highcharts, ApexCharts. We use it in our tool&#x2F;library <a href="https:&#x2F;&#x2F;docs.chartsql.com&#x2F;" rel="nofollow">https:&#x2F;&#x2F;docs.chartsql.com&#x2F;</a>

After many trials with other libraries, my team settled on Apache ECharts last year, and we do not regret it: excellent documentation, performant, highly configurable yet easy to use, and supporting all the chart types we need (bars, stacked bars, maps, zoomable&#x2F;scrollable time series, and scatter plots).

The line race looks so cool.<p><a href="https:&#x2F;&#x2F;echarts.apache.org&#x2F;examples&#x2F;en&#x2F;editor.html?c=line-race" rel="nofollow">https:&#x2F;&#x2F;echarts.apache.org&#x2F;examples&#x2F;en&#x2F;editor.html?c=line-ra...</a><p>Toggle the switches to trigger the race. By the way, well done Norway.

If you&#x27;re looking for a chart library for a web client, I also recommend charts.css. It&#x27;s a godsend honestly, the concept is way simpler than most charts libraries and can achieve the same thing. Makes it so simple to use the old way, server side rendering, htmx, etc...<p><a href="https:&#x2F;&#x2F;chartscss.org&#x2F;" rel="nofollow">https:&#x2F;&#x2F;chartscss.org&#x2F;</a>

I’d keep it.<p>Announcement: “ECharts, a JS charts package” My assumption: It’ll be unmaintained within a year.<p>Announcement: “Apache ECharts, a JS charts package” My assumption: It’ll be maintained next year.

Glad to see Echarts getting the recognition it deserves. It is arguably the best open-source visualization library out there.<p>Here are some points others haven&#x27;t mentioned:<p>(a) Uses canvas by default. Faster than any other library I&#x27;ve used.<p>(b) Extremely flexible. Want to write your own widget on top of the graphs (eg., a customized tooltip). Possible!<p>(c) Provides a lot of metadata. Want to get the position of a point in the rendered chart, to use in your code? Entirely possible!<p>(d) Works really well when importing into legacy web apps. They even provide an option to get a customized build on their site.<p>(e) Very good at handling streamed data. The animation is very smooth between data changes.<p>I&#x27;ve been using it for almost 7 years now for various production and personal projects, and it&#x27;s still my go-to library. Their docs have come a long way since then.<p>They do have long standing bugs that get annoying, e.g, dealing with 0 when using log scales, provided there are workarounds for it. I haven&#x27;t noticed any blocking bugs for most common usecases.

In a quick web demo, this library was the only one that could handle interactive viewing and manipulation of a very large graph using its GraphGL component ! I don’t think it&#x27;s a well-known visualization library, but it&#x27;s quite interesting ...

I was just looking into charting libraries for React&#x2F;React Native, and Apache ECharts seems like a great contender for cross-platform data visualization. The libraries that I came across - react-echarts (<a href="https:&#x2F;&#x2F;github.com&#x2F;hugocxl&#x2F;react-echarts">https:&#x2F;&#x2F;github.com&#x2F;hugocxl&#x2F;react-echarts</a>) and react-native-echarts (<a href="https:&#x2F;&#x2F;github.com&#x2F;wuba&#x2F;react-native-echarts">https:&#x2F;&#x2F;github.com&#x2F;wuba&#x2F;react-native-echarts</a>) - both seem to be actively developed, and the fact that it&#x27;s under Apache is a huge plus for future development prospects and maintenance of the project.

Noticed it uses HTML5 canvas to render data by default. To screen readers, am I correct in understanding that this is equally accessible as when people share screenshots of text?<p>There is an SVG option that looks identical but it doesn&#x27;t say when you&#x27;re supposed to use that, or why canvas exists (and is the default) if SVG would work equally well. Then again, setting an example chart to use SVG rendering (I was looking at the basic scatter plot functionality, since I use that most often), I can&#x27;t seem to tab or otherwise navigate through the data points, so it may just be impossible to get the data read out to you like &quot;first data point, year 2006 students 25 939&quot; (if the axes were labeled &quot;year&quot; and &quot;students&quot;, for example; they&#x27;re not labeled in the example but it could still read out the positions of the points)

We [1] just added to ECharts as a charting library for our AI and are switching the default GUI charts over to it as well. We did a pretty extensive review before selecting it. ECharts won because it&#x27;s excellent, and very pretty.<p>1. <a href="https:&#x2F;&#x2F;sourcetable.com" rel="nofollow">https:&#x2F;&#x2F;sourcetable.com</a>

Apache Superset switched many of their interesting charts over to ECharts:<p><a href="https:&#x2F;&#x2F;preset.io&#x2F;blog&#x2F;2021-4-1-why-echarts&#x2F;" rel="nofollow">https:&#x2F;&#x2F;preset.io&#x2F;blog&#x2F;2021-4-1-why-echarts&#x2F;</a>

Impressive work! Their main demo there pays some homage to Mike Bostock&#x27;s d3 transitions showcase from 2011: <a href="https:&#x2F;&#x2F;mbostock.github.io&#x2F;d3&#x2F;talk&#x2F;20111116&#x2F;transitions.html" rel="nofollow">https:&#x2F;&#x2F;mbostock.github.io&#x2F;d3&#x2F;talk&#x2F;20111116&#x2F;transitions.html</a> (click to start)

We use ECharts extensively in Evidence (<a href="https:&#x2F;&#x2F;github.com&#x2F;evidence-dev&#x2F;evidence">https:&#x2F;&#x2F;github.com&#x2F;evidence-dev&#x2F;evidence</a>). Overall has been a delight.

Superset[1] BI tool is a good example of how useful ECharts are<p>[1] <a href="https:&#x2F;&#x2F;superset.apache.org&#x2F;" rel="nofollow">https:&#x2F;&#x2F;superset.apache.org&#x2F;</a>

Just a nit: the part that describes its mobile optimized (and pretty much all other pages describing the features) does not load correctly on mobile.<p><a href="https:&#x2F;&#x2F;echarts.apache.org&#x2F;en&#x2F;feature.html#mobile" rel="nofollow">https:&#x2F;&#x2F;echarts.apache.org&#x2F;en&#x2F;feature.html#mobile</a>

What a complete exhaustive set of examples! Very useful. Both SVG and Canvas renderers differ very little and both seem to be super performant. The declarative API is just so simple... harkens back to the age of batteries-included web frameworks like Ext.

we use eCharts for all the visualizations in <a href="https:&#x2F;&#x2F;www.definite.app&#x2F;" rel="nofollow">https:&#x2F;&#x2F;www.definite.app&#x2F;</a>.<p>We evaluated pretty much every option and it&#x27;s the best non-react option. Recharts honestly seems a little nicer if you&#x27;re using React, but our frontend is in Vue.

I really wish the “slowly fade elements in as they scroll onto the screen” would die.

What does this have over Plotly, Chart.js, D3, Bokeh, etc

22.7MB to download the latest release from Github (87.3MB unzipped). That&#x27;s an insane amount of JS to download and compile (people often complain about React being ~50kb).<p>The default recommended way to use it is `import * as echarts from &#x27;echarts&#x27;` which means you are getting the WHOLE thing.<p>Does anyone with experience know how big is it when you pick and choose modules?

I don&#x27;t think I ever see Wechat and Weibo in the &quot;Follow Us&quot; box. Was this donated to Apache by a Chinese company? I feel like we will see a lot more of this in the coming years.

The only thing I ever want out of these chart libraries is to be able to theme them. Does anyone know how customizable the theming for ECharts is?

How does it compare to <a href="https:&#x2F;&#x2F;www.chartjs.org&#x2F;" rel="nofollow">https:&#x2F;&#x2F;www.chartjs.org&#x2F;</a> ?

Related, I just wrote an article and demo about enabling Apache ECharts in React[1] this week.<p>[1] <a href="https:&#x2F;&#x2F;tania.dev&#x2F;apache-echarts-react&#x2F;" rel="nofollow">https:&#x2F;&#x2F;tania.dev&#x2F;apache-echarts-react&#x2F;</a>

This is super slick. I remember spending <i>hours</i> maybe days trying to make MRTG or rrdtool graphs look like these.

Sorry if this is a silly question but how does a project become &quot;Apache&quot;? Like is there a core team starting these projects or is there an application process for a project to be under the Apache banner?

I like ECharts a lot and generally, it was incredibly easy to use and customize. I tried a lot of alternatives that weren’t nearly as full featured. It’s really got most anything you’d want included in outta the box.<p>With that said, I had trouble getting it to stream updates, and was having big performance issues with the dataset I was throwing at it (full telemetry from a racing sim roughly every 12ms). I did not make any attempt to refine the data before delivering it so YMMV. I eventually switched to Plotly and D3 to get better performance, but definitely missed the ease of use.

I would love it if was possible to download the rendered chart, ideally headless. In peak traffic I would prefer to switch to a pre-rendered version, have the pre-rendered version available encase of an error (i.e. data retrieval), or for users not using JS.<p>After the most minimal Google-foo, I see echarts-python [1] which has not been updated in 9 years. pyecharts [2] is looking pretty well maintained though.<p>Years ago I tried my hand at writing a simple bar&#x2F;line plotting filter for Pandoc that embeds itself into documents via an SVG in a URI [3]. If HN is permitting, you can past links like so [4]. I think writing a stand-alone tool to display the data you are interested in is a good idea for anybody.<p>[1] <a href="https:&#x2F;&#x2F;github.com&#x2F;yufeiminds&#x2F;echarts-python">https:&#x2F;&#x2F;github.com&#x2F;yufeiminds&#x2F;echarts-python</a><p>[2] <a href="https:&#x2F;&#x2F;github.com&#x2F;pyecharts&#x2F;pyecharts&#x2F;blob&#x2F;master&#x2F;README.en.md">https:&#x2F;&#x2F;github.com&#x2F;pyecharts&#x2F;pyecharts&#x2F;blob&#x2F;master&#x2F;README.en...</a><p>[3] <a href="https:&#x2F;&#x2F;gitlab.com&#x2F;danbarry16&#x2F;pandoc-highlight-filter&#x2F;-&#x2F;blob&#x2F;svg_abstract&#x2F;plott.py?ref_type=heads" rel="nofollow">https:&#x2F;&#x2F;gitlab.com&#x2F;danbarry16&#x2F;pandoc-highlight-filter&#x2F;-&#x2F;blob...</a><p>[4] (removed link as it was too long for the comments section)

We use Echarts on our Bluesky analytics site<p><a href="https:&#x2F;&#x2F;bluefacts.app&#x2F;profile&#x2F;bsky.app" rel="nofollow">https:&#x2F;&#x2F;bluefacts.app&#x2F;profile&#x2F;bsky.app</a><p>Really great experience, we optimized the imports to reduce bundle size.<p>For <a href="https:&#x2F;&#x2F;www.appbrain.com" rel="nofollow">https:&#x2F;&#x2F;www.appbrain.com</a> we also use it and had to optimize it even more.We render it server side and only return the SVG to the client.<p>Server side rendering is a very powerful feature only very few chart libraries support.

We [1] use ECharts to visualize all of our data and it&#x27;s pretty great to use.<p>It&#x27;s also very pluggable, so one can only import the components one needs for each chart. Meaning if you only use the `bar` series type, you can just only import the `bar` component. Same thing not only for other chart types but also stuff like mark areas or zoom controls.<p>There&#x27;s also a bigger update in the work which brings e.g. violin plots.<p>[1] - <a href="https:&#x2F;&#x2F;donation.watch&#x2F;" rel="nofollow">https:&#x2F;&#x2F;donation.watch&#x2F;</a>

We have been using Apache ECharts in our products[1] since 2020.<p>Cannot recommend it enough - absolutely fantastic library, great documentation, zero issues of any impact to us in five years.<p>My only wish is for the keyboard accessibility ticket[2] to get some love!<p>[1] <a href="https:&#x2F;&#x2F;factorhouse.io" rel="nofollow">https:&#x2F;&#x2F;factorhouse.io</a><p>[2] <a href="https:&#x2F;&#x2F;github.com&#x2F;apache&#x2F;echarts&#x2F;issues&#x2F;14706">https:&#x2F;&#x2F;github.com&#x2F;apache&#x2F;echarts&#x2F;issues&#x2F;14706</a>

We moved from plotly to eCharts at OpenObserve, having faced too many small things that we had to fight with plotly. Haven&#x27;t looked back since the migration.

Do anyone have experience with this in comparison to vega?

Just recently (like 2 months ago) I had the task to evaluate proper OSS replacements for the main charting of a client. So far, they&#x27;ve used a paid solution - but there have been a couple of reasons why the wanted to migrate.<p>Needless to write that eCharts was the clear winner. Not only is it greatly customizable, fully feature complete - it also had similar performance data as their paid solution. And performance matters as their largest chart has around 300k data (we discussed and could maybe be satisfied with 80-100k as well - but for most OSS charting libs even that would be pretty much impossible to render quickly).<p>For everyone who is looking for something super easy and quick it might not be the best solution (personally I like Chart.js in this area the most), but if you want a charting solution that out of the box is fast and comes with everything you might ever need then eCharts is for you.

ECharts powers all charts in tablab.app. Might be using 20 different chart types or so<p>Very happy with it.<p>Theming works well (saw a question or two about that)

Installing from random npm repos is so sketchy with supply chain attacks.<p>Is there such a thing as a security audited open source distro kinda like some of the ultra old kernel versions RHEL carried for so long?<p>There is a market for “here are trailing versions of popular npm, cargo, etc libraries that go through some kind of audit and approval process”.<p>I’m not sure of the logistics of how it would work, but developers ripping random high churn libraries off the internet is completely crazy from a security perspective. But somehow it’s the norm outside of a small subset of massive tech companies.<p>Most big orgs just put in some kind of pass through proxy looking for known signatures and call it a day. I want stripped down functionality, real reviews, and just straight up banned libraries if they can’t find anything that passes.

We are actually using Apache ECharts to visualize system performance data in real-time using eBPF.<p>We had to do a bunch of stuff on top of it to get it working but all in all pretty nice.<p>You can check it out here in our sandbox:<p><a href="https:&#x2F;&#x2F;yeet.cx&#x2F;play" rel="nofollow">https:&#x2F;&#x2F;yeet.cx&#x2F;play</a>

The demo page is ridiculously long. I ran out of things to search for. Well done!<p><a href="https:&#x2F;&#x2F;echarts.apache.org&#x2F;examples&#x2F;en&#x2F;index.html" rel="nofollow">https:&#x2F;&#x2F;echarts.apache.org&#x2F;examples&#x2F;en&#x2F;index.html</a>

I’ve had good luck generating charts with gnuplot and serving them as static images—keeps things simple and easy to cache. Haven’t had a need for a full JS charting library yet, but I can see the appeal.

what&#x27;s the best way to use a JS visualization library like this while using python for data extraction &#x2F; manipulation in a notebook format (eg. Jupyter notebook, Google Colab, etc.) ?

I&#x27;ve been meaning to practice some data visualization tasks... If anybody knows any cool datasets they&#x27;d recommend that aren&#x27;t your run of the mill kaggle consumer data or whatever. I&#x27;m particularly interested in bioinformatics&#x2F;genetics data but not really sure of where to look (and have almost no background, just personally interested in comp-bio).. If anyone could recommend cool and open esoteric data&#x2F;possible projects, that would be awesome.

No opinion on this particular package. But on the naming, &quot;Apache&quot; ECharts...<p>It&#x27;s long since time that Apache foundation projects stop using the Apache name. Apache is a license, a foundation, a webserver. Apache supported projects have little to do with that - not the same people, not the same product area. Just some help with money and logistics.<p>And for those that argue the tie to the Apache org:<p>They&#x27;re not CNCF Kubernetes, CNCF Helm, CNCF Jaeger. They&#x27;re Kubernetes, Helm, Jaeger.

Anybody have experience using echarts with Vue 2.6? This looks way easier to implement than chart.js, but I’m worried about compatibility with such an old Vue build.

This is great. I was always looking for a well licensed library that is well maintained and ships a coherent featureset. This seems to tick all the boxes.

I&#x27;ve been using apache echarts for a while. It is excellent. As you dig deep, some of the examples and libraries are in Chinese, which can be challenging.<p>The only real drawback that I&#x27;ve discovered is that it uses canvas to generate the charts. So, when you UI changes to dark mode, you need to reload your charts to update the color scheme ... which in the grand scheme of things is really minor.

Late to the party here but we (Sentry) have been using ECharts since 2018 (<a href="https:&#x2F;&#x2F;github.com&#x2F;getsentry&#x2F;sentry&#x2F;pull&#x2F;9072">https:&#x2F;&#x2F;github.com&#x2F;getsentry&#x2F;sentry&#x2F;pull&#x2F;9072</a>) and still holding strong!

Oh, good that it can choose between canvas or svg. <a href="https:&#x2F;&#x2F;apache.github.io&#x2F;echarts-handbook&#x2F;en&#x2F;best-practices&#x2F;canvas-vs-svg&#x2F;" rel="nofollow">https:&#x2F;&#x2F;apache.github.io&#x2F;echarts-handbook&#x2F;en&#x2F;best-practices&#x2F;...</a><p>Canvas is the only game in town if you have huge amount of datapoints.

The AWS Quicksight BI tool uses it underneath.

I wish it handled time zones properly, but everything else just works. The number of charts it supports is crazy. The second best was Apexcharts.<p><a href="https:&#x2F;&#x2F;echarts.apache.org&#x2F;examples&#x2F;en&#x2F;index.html" rel="nofollow">https:&#x2F;&#x2F;echarts.apache.org&#x2F;examples&#x2F;en&#x2F;index.html</a>

Used this for some knowledge graph visualization work. Really clean UI and some nice features out of box for interactivity

The `echarts4r` [1] R package lets you create ECharts charts directly in R and render them in graphical device, Shiny apps, Rmarkdown or Quarto documents.<p>[1] <a href="https:&#x2F;&#x2F;echarts4r.john-coene.com&#x2F;" rel="nofollow">https:&#x2F;&#x2F;echarts4r.john-coene.com&#x2F;</a>

Reminds me of <a href="https:&#x2F;&#x2F;d3js.org&#x2F;" rel="nofollow">https:&#x2F;&#x2F;d3js.org&#x2F;</a>

Pleasing visual which had my browser&#x27;s FPS went low, especially at the liquid fill extension part.

Over the last 7 years I&#x27;ve built 3 major products that needed charts. Every time I tested most of (at that time) popular solutions. All 3 times eCharts was by far the best option, across all criteria. Incredible library!

Happy eChart user. Added a tiny Reactjs wrapper on the top and ditched all D3 libraries. Never look back. Easy to inline and embed into slatejs based documents. Usable on mobile and responsive enough for my use cases.

There is a super interesting port of ECharts to Rust: <a href="https:&#x2F;&#x2F;github.com&#x2F;yuankunzhang&#x2F;charming">https:&#x2F;&#x2F;github.com&#x2F;yuankunzhang&#x2F;charming</a>

Wow what a blast from the past. I used this library many years back when I think it was called Baidu E-Charts. Was a great library back then too. I&#x27;m amazed how good its gotten now.

No Debian package. Requested since 2022: &lt;<a href="https:&#x2F;&#x2F;bugs.debian.org&#x2F;1014408" rel="nofollow">https:&#x2F;&#x2F;bugs.debian.org&#x2F;1014408</a>&gt;

It&#x27;s developed by Tencent developers. Probably if you would like to get chart of China crimes against humanity you would get an error ;-)

I was particularly impressed with how performant the demo was as it was playing. I was fully expecting my Macbook-fan to start whirring as it usually does with most javascript-heavy pages.

longterm google charts user. This has attraction. Good eye candy feel, responsive.<p>There are some specific things google charts do, like mark out kashmir and other disputed territories differently depending on your origin IP&#x2F;AS so you don&#x27;t fall foul of Indian law.<p>There are some things google charts don&#x27;t do, like re-center maps off the meridien they think is best. Scaling geo charts for the pacrim island nations is also very hard. No good choices there perhaps.<p>Is there a migration guide?

I&#x27;ve probably used Apache e-charts in some way or another in every project I&#x27;ve been on in the last decade. One of those packages that just works out of the box.

Never seen so much positivity related to a tool since SQLite

ECharts was handy for getting a quick chart going in a typing practice app I wrote. It was easy to get a chart showing WPM over time on a word list.

Does anyone know of a way to print echarts to a PDF, without having a headless Chromium instance involved? Been fighting this at work.

Echarts can correctly animate data thats streaming via a moving window from right to left. Some other libs have issues in this case.

The &quot;Examples&quot; page doesn&#x27;t work for me. I don&#x27;t get further than &quot;Line Charts&quot;. (Firefox)

Are ECharts safe for untrusted user input?

Looks like it could work nicely with HTMX.

The fact that it seamlessly switches between &lt;CANVAS&gt; and &lt;SVG&gt; is marvelous!

The demo is seriously impressive! I haven’t heard of this library before, will definitely consider using it

I love echarts, I&#x27;ve used it at almost every company I&#x27;ve worked at to this day since I found it.

after trying many charting, we settled on Apache Echart as well. its really flexible for lot of use-cases and customizable. if this doesnt work for you, the only option left is D3. Btw, we have not looked at many paid chart options like hicharts or other.

I&#x27;d really like to know how they did all the transition effects. They were really cool.

How did I not know about Apache ECharts?!? Thank you HN. This is awesome.

Nivo seems really nice. I recall that fey.com used it for their charts.

Times sure do change - nice acquisition- hope it stays open

I never heard of them, hmm. Apache doing great work here.

How is the Apache project still alive? Who funds them?

What a beautiful presentation!

wow!!<p>Though it did not seem to have trading related charts like candlesticks and others

This is so cool!

what happened to sankey? no sankey graph??

Is it Vibe Coding friendly?