Questions tagged [echarts]

Apache ECharts is a free open-source charting and data visualization library written in JavaScript. ECharts provides a powerful, interactive charting and data visualization library and framework for web browser, mobile App and backend usage.

Description

ECharts is a free, powerful charting and visualization library offering an easy way of adding intuitive, interactive, and highly customizable charts to your commercial products.
It is written in pure JavaScript and based on zrender, which is a whole new lightweight canvas library.

Currently (May, 2019) ECharts is an incubator project of Apache Software Foundation. Please check its incubator status here

History

ECharts (a contraction of Enterprise Charts) was previously a commercial charting solution originally intended to address the report need of the Company's various business systems, such as Baidu Promotion (凤巢), Advertising Manager (广告管家).

Previously we used Flash to fulfill those needs, but the problem is, due to Baidu's highly clear-cut division of labor, there is a special team in charge of Flash. As a result, everything – from the design of data interface to personalized needs - has to be negotiated and agreed upon, leaving little room for front-end engineers to control completely. Moreover, there is no Flash common to all the scenes in a system. Worse still, Steve Jobs, the co-founder and then CEO of Apple Inc., insisted that Apple wouldn't allow Flash on the iPhone, iPod touch and iPad. For all these reasons, and given the soaring popularity of html5, we decided to try something else. Therefore in early 2012 Lin Feng (Kener), the then front-end technical director of Baidu Promotion, tried to make charts via Canvas in the Data Platform Project of Baidu Promotion. He wrote a whole new lightweight Canvas library ZRender, which is actually the prototype of ECharts, albeit miles from the one in front of you now.

References

1257 questions
35
votes
6 answers

How to minimize whitespace around Baidu's echarts

I'm trying to incorporate Baidu's echarts (which look really good). However, there is a lot of whitespace around the actual graph when one doesn't set a title nor uses their toolbar. Is there a way to have the graph/chart use more of the canvas? My…
max.ott
  • 569
  • 1
  • 6
  • 16
26
votes
7 answers

Different color bar chart from eCharts

I was trying to create a different color bar. For Mon blue, Tue red, Wed green. Please help me how to write it. Line itemStyle: {normal: {color: 'blue','red', 'green'}}, did not work. The code comes from the echarts site.
Goffer
  • 370
  • 1
  • 3
  • 14
23
votes
4 answers

ECharts: how to show all axis labels?

Echarts seems to have a nice feature that automatically chooses which labels to display depending on the space provided. However, this algorithm seems to be bit too aggressive at times and does not take into account text rotate. I've gone through…
cgat
  • 3,689
  • 4
  • 24
  • 38
16
votes
1 answer

echarts Y axis label having vertical text

All I'm trying to make charts using e charts library read the documentation and find lots of example over internet too but unable to find how to write label in y-axis with vertical text. As per the docs where it might be write is axisLabel : {}…
Rupesh Arora
  • 557
  • 2
  • 9
  • 26
16
votes
4 answers

ECharts: How to use the resize event of the window?

Im trying the Echarts library for my graphs. I'd like to resize the plots when the window's resize trigger is fired but I can't find the way to do it. Thanx for your help
Lolo
  • 527
  • 2
  • 8
  • 26
15
votes
3 answers

ECharts refresh on data change

I'm currently working on an interactive chart which should calculate potential risk-factors of commercial project. I've been using Baidu ECharts for this, and got the graph working visually, but can't get the graph to update when data changes. The…
Sonioo
  • 163
  • 1
  • 1
  • 7
15
votes
3 answers

Echarts3 (baidu) colored round in tooltip

Echarts3 (baidu) colored round in tooltip By default the tooltip has rounds of the same colour as graph, like this: http://echarts.baidu.com/gallery/editor.html?c=candlestick-brush But if I customize the tooltip it removes the colour coded round…
Yevgeniy Afanasyev
  • 37,872
  • 26
  • 173
  • 191
15
votes
7 answers

Echarts and bootstrap: responsive width

With Echarts (from Baidu) i want put a pie chart inside a div element (i'm using bootstrap). So i have:
I've take the javascript…
Tom
  • 4,007
  • 24
  • 69
  • 105
15
votes
8 answers

ECharts from Baidu

Does anyone know of an Echarts (http://echarts.baidu.com) example that: Only uses english characters Correctly imports all the necessary includes from a local directory structure Works All the Echarts examples are presented very nicely but there…
Andrew-NZ
  • 492
  • 1
  • 5
  • 14
14
votes
3 answers

Scatter plot with colored markers + colormap in ECharts

After reading the ECharts documentation and looking at examples, I haven't found anything that would allow coloring scatter plot markers automatically according to a continuous data dimension. Basically, I'm trying to plot something like this:…
bluenote10
  • 23,414
  • 14
  • 122
  • 178
11
votes
3 answers

how to add formatter tooltip in echart for multiple values for pie diagram

I am using echart pie diagram but I want to show multiple records in tooltip. option = { tooltip: { trigger: 'item', formatter: '{a}
{b} : {c} ({d}%),
{name1} : {value1} ' }, legend: { orient:…
gauri
  • 309
  • 2
  • 6
  • 14
11
votes
2 answers

How to remove grid from line chart of Echart library

I will draw a line chart by echart library. When I draw a chart, it shows grid too. I do not need grid, but I cannot remove it. I have checked out Echart options and I know that grid:{show=false} is an option of echart but it is not effective. My…
11
votes
1 answer

echarts Media queries not working with Bootstrap (carousel)

I have a bootstrap carousel with 2 slides. Both the slides uses bootstrap grids of 2x2 to display charts on them. They are working fine , however I am trying to implement responsive media queries and can't seem to make it work. I used baseOptions…
Anjan Biswas
  • 7,746
  • 5
  • 47
  • 77
11
votes
1 answer

Dynamically add data and series to Echarts

I'm trying to learn and use echarts. I learned how to create a static chart using echarts and now I need to add data and series to my chart, dynamically. There's methods like addSeries and addData in API but when I try to use these methods, there is…
Kiyarash
  • 2,437
  • 7
  • 32
  • 61
10
votes
3 answers

ECharts: Disable default click action on legends

I'm trying to use ECharts to render a simple doughnut chart which I've been able to do. I've noticed by default that the legend will hide the data item on the chart if it is clicked. I want the user to be able to select the legend to do something…
Serberuss
  • 2,247
  • 4
  • 22
  • 40
1
2 3
83 84