Hacker News new | past | comments | ask | show | jobs | submit login
Echarts 2.0 (ecomfe.github.io)
133 points by ninebrows on Jan 6, 2015 | hide | past | favorite | 43 comments



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


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 (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?


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


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


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


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


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


What are the implications of using a patented feature of an open source project?


I don't know, but it can't be good.


They can do live data streaming


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 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 as well as a version that had a social sharing system with 2-way synchronization "micropresentations" (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

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


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


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.


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.


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.


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


Nope, it's not that difficult to understand, though English captions for buttons would be nice to have


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?


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


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/ as this is this lets the end user play with data.


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


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!


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


Alibaba has a ton of Open Source: http://alibaba.github.io/

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


There are more. For example, Taobao and its Nginx port [1].

[1] http://tengine.taobao.org/


There are more. For example, Taobao and its Nginx port [1].

[1] http://tengine.taobao.org/


There are more. For example, Taobao and its Nginx port [1].

[1] http://tengine.taobao.org/


There are more. For example, Taobao and its Nginx port [1].

[1] http://tengine.taobao.org/


There are more. For example, Taobao and its Nginx port [1].

[1] http://tengine.taobao.org/


There are more. For example, Taobao and its Nginx port [1].

[1] http://tengine.taobao.org/


There are more. For example, Taobao and its Nginx port [1].

[1] http://tengine.taobao.org/


There are more.


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.


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.


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.


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


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.


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.


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


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


Nice... examples could be in english!


There are few adapted examples - http://echarts.datamatic.io/


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.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: