
Echarts 2.0 - ninebrows
https://ecomfe.github.io/echarts/index-en.html
======
acomjean
Looks good. I did some evaluation of javascript graphing packages at my last
position (migrating away from flash). We ended up paying for one.

This looks great, contains a lot of useful graph types. I like the fact that
the charts can be rendered and saved as png images. This is a feature often
lacking in a lot of javascript graphing packages. Couldn't see if you can pass
in the data via ajax (update after rendered), but I'll look some more.

They claim to have patented one of the features: Our "Drag-Recalculate"
feature (patented) [https://ecomfe.github.io/echarts/doc/feature-
en.html](https://ecomfe.github.io/echarts/doc/feature-en.html)

~~~
floatrock
The Drag-Recalculate feature is neat, but limited and often results in
nonsensical operations.

For example, imagine a simple bar chart of fruits that people have:

Alice: 5 apples, 6 oranges

Bob: 10 apples, 2 oranges

From a quick perusal of the examples, you can drag Alice's apples onto Bob's
apple stack. Now Bob has 15 apples? wat? It seems you can even drag Alice's
apples onto Bob's oranges. Try it yourself:
[https://ecomfe.github.io/echarts/doc/example/bar4.html#-en](https://ecomfe.github.io/echarts/doc/example/bar4.html#-en)
(not sure what those funny characters on the left say, but imagine they say
Alice, Bob, Charlie, etc., and the colors are apples, oranges, radishes, etc.)

The behavior also only really works if you're working with sum aggregations.
If you're talking about averages or mins, you again get non-sensical
combinations.

It's a neat behavior, no doubt, but it's very limited in the cases when it's
appropriate. Some of their examples show cases where you can use it non-
sensically. Unless the visualization is being produced by an expert who knows
when NOT to use shiney features, I fear people will get too excited by the
shineyness and create completely inappropriate visualizations. Remember when
3D bars were the shit?

~~~
uptown
The default for Drag-Recalculate is "false" so a developer would need to
specifically choose to enable this functionality.

------
cromwellian
Back in 2008 I released an open source library (Chronoscope) designed to
render very large datasets in real time (See video here
[https://www.youtube.com/watch?v=2ScPbu8ga1Q#t=1607](https://www.youtube.com/watch?v=2ScPbu8ga1Q#t=1607)
showing off the display of 1 million+ datapoints) It was written in GWT, ran
on the server (server side rendered chart tiles like Google Maps), Android,
and Web, had JS exported APIs (through my GWT Exporter library), and
microformat support.

Doing it back then was somewhat more difficult because Javascript was much
slower and the 2D canvas wasn't very accelerated. The approach I took was to
use a multiresolution "mipmap" like representation of the data. When
animating, lower details were chosen, and the system would bound the max
number of points to draw that would achieve a given FPS, and choose the detail
level dynamically.

I also offered a commercially supported version at the time, Timescope, other
types of charts.
[https://www.youtube.com/watch?v=RLYNHQVIeNg](https://www.youtube.com/watch?v=RLYNHQVIeNg)
as well as a version that had a social sharing system with 2-way
synchronization "micropresentations"
([https://www.youtube.com/watch?v=RLYNHQVIeNg](https://www.youtube.com/watch?v=RLYNHQVIeNg))

Micropresentations allowed you to "script" the chart via a markdown-like/Wiki
like text annotation in comments. This means when you were debating or
responding to some chart, you could move the chart around, add empheral
markers, or other call outs, even video, in order to make your point.

[https://www.youtube.com/watch?v=RLYNHQVIeNg](https://www.youtube.com/watch?v=RLYNHQVIeNg)

The old code is [https://code.google.com/p/gwt-
chronoscope/](https://code.google.com/p/gwt-chronoscope/) if anyone is
interested.

------
aw3c2
Has anyone found an example of "big" dataset with some interactivity?
[https://ecomfe.github.io/echarts/doc/example/scatter3.html#-...](https://ecomfe.github.io/echarts/doc/example/scatter3.html#-en)
only shows a static image (with mouse over but I am looking for something with
selections or filtering).

~~~
xs
The link you gave actually has 20,000 points of data on that graph. The
example is interactive so go ahead and change line 45 or line 65 to something
bigger then click the green button if you want to see a bigger data set. I
love how their examples are interactive right on the page.

~~~
aw3c2
I see no interactivity there. The mouse only shows the x and y coordinates. As
I said, I am looking for examples where the data is manipulated. Mouse over
that shows data values would also be interesting though.

~~~
cuong
Is the UX really that difficult to understand? There's a selection box at the
top-right corner. Click on it and use it to zoom deeper into the graph.

~~~
aw3c2
Oh, I had no idea what those icons apart from Refresh and Save meant. The zoom
icon looked like "new something" to me. Thanks!

------
chrisfarms
This looks incredibly comprehensive! ...almost too good to be true, I'm
waiting for the gotcha....

Does anyone have any experience to share experimenting with it yet?

~~~
JelteF
One of the gotchas is that the comments are in Chinese, so it will be much
harder to send in useful pull requests.

------
awjr
Being able to manage 'big data' is quite impressive. Personally I'm a massive
fan of dc.js [http://dc-js.github.io/dc.js/](http://dc-js.github.io/dc.js/) as
this is this lets the end user play with data.

------
sideproject
ok, so I've done over the years my fair share of using all sorts of JS
charting libraries. So far, Highcharts comes at the top.

Along the way, I've seen a plenty of new libraries popping up, but none so
far, has matched the quality of Highcharts.

But this seems... just... too good. Gotta give it a try. I wish I was fluent
in Chinese. :)

------
hippich
This is one of the best charts library I've seen lately judging from
docs/examples. Response nicely to change of the size and adding data into
already instantiated charts seems super easy!

------
mortenjorck
Is Baidu the first major Chinese tech company to start maintaining open source
projects on the scale of Google or Facebook?

~~~
bdotdub
Alibaba has a ton of Open Source:
[http://alibaba.github.io/](http://alibaba.github.io/)

They're a major technological powerhouse, to the point where they offer their
own AWS equivalent: [http://www.aliyun.com/](http://www.aliyun.com/)

------
caoglish
Chinese who works at English company still can not use this library, because
too many Chinese characters to work with others who did not understand
Chinese.

This library is very good and comprehensive, if this library is really in
English, I believe it will become a big thing.

------
polskibus
if only most of their documentation and code comments weren't written in
chinese. It's great that they open sourced it - looks really good, but it will
be hard for non chinese to grasp the more complex aspects of this library.

~~~
SwellJoe
Imagine how hard it's been for Chinese speakers to learn to code and use most
modern libraries. I'd say the billion+ Chinese folks can represent a large
enough audience for this library, if English-speakers don't want to figure it
out (and maybe help with translations).

When it comes to code, I generally want lots of good examples more than
documentation, and there seem to be a reasonable amount of examples (I haven't
spent much time trying to make sense of them, yet).

I'm implementing a new charting system for our products, and haven't yet
settled on the graphing library (leaning toward Rickshaw, but also considering
Metrics Graphics), so I'll give this a shot. It looks really promising,
particularly with regard to large data sets, since that's something most
graphing libraries fall down on...we current reduce our data set to 1024 or
fewer data points before sending to the graph. It might be awesome to have all
the data in the client and let them zoom in and out at will.

------
crudbug
Having a separate English & Chinese version of the documentation can surely
help.

------
danoprey
Just the one Baidu image would suffice ;) Don't need one for every site they
use it on. Also, I know it's not _that_ similar, but the logo still said
Docker to me.

------
nijiko
It looks great, however it feels a bit sluggish when hovering over points and
doing drag operations in the major browsers, few hundred ms of delay.

~~~
watty
I believe the hover is throttled to avoid constant animations, so maybe 100ms
before it'll draw the tooltip.

------
thatmiddleway
Being a programmer and learning Chinese is starting to look like a useful
skill. The documentation for this is just another example.

------
sitnik
Nice... examples could be in english!

~~~
jarben
There are few adapted examples -
[http://echarts.datamatic.io/](http://echarts.datamatic.io/)

------
DougHaber
I had recently been evaluating JavaScript charting packages, and ended up
moving forward developing with HighCharts, just a couple days ago. The demos
for Echarts are impressive, so when I saw this today I spent a little time
trying it out.

If you want to use the standalone single JavaScript file, their complete "all"
build is 910k. That seems a little large, but their full package includes map
data and lots of chart types you probably won't use.

They do have a tool for making a custom build, but I just got errors when
using it. Google translate helped with their documentation, but even when I
followed their exact steps it didn't work. This isn't a big deal though, as a
Makefile can be thrown together quickly.

I have been working on a site that is heavy on charts, and I decided to switch
my pie chart generators to Echarts as a test. I can't pinpoint all the
reasons, but I felt like it was a little awkward to use, though it didn't take
long to get through that. The documentation was helpful, but not great, and
certain parts of it were not available in English.

There were some oddities that confused me at first, though in some ways they
make sense. For example, the DOM element that contains the chart must have a
CSS height defined, or you get an error. And, the legend seems to require you
to provide a redundant array of all the labels that appear in the series.
Nothing too bad.

I don't know if it is just my chart, but the default colors came out awful.
I'm sure that can be changed, so it isn't too concerning. I noticed a few
other rough edges, for example the save image control saves the exact view
into the image file, with the controls included as well.

Mobile worked decently in my test, though charts with the legend enabled often
resulted in bad overlaps between the legend and the chart.

I tried messing with maps a little, and that was my favorite part. It was very
smooth and easy to get going with. I have been looking for a good JavaScript
map package, and this seems to have some potential. (Anyone have
recommendations on choropleth maps in JS?)

Overall, I'm a little scared to move forward with Echarts. Searching online
makes it seem difficult to find answers to many problems in English. Also,
difficulty in modifying code quickly when the comments are not in a language I
understand is also worrisome. Still, I'd definitely keep my eye on this.
Without too much trouble I was able to convert charts to generate with this
instead of HighCharts. It is unquestionably the best JavaScript charting
library I have seen with this type of license, and I'm sure it will get even
better.

I feel like if I moved forward I'd be spending too much time figuring things
out, and so despite really liking the idea of open source charts with no
licensing fees, I'm going to play it safe an stick with HighCharts. I'd rather
pay the fee for a quality product than spend time trying to get all the
features I need working. At the same time, I imagine many others out there
with different needs may find that Echarts is a very decent option.

