What are ECharts?

What are echarts?

echarts (Enterprise Charts, commercial-grade data charts) is an open source visualization library implemented using JavaScript. It can run smoothly on PCs and mobile devices and is compatible with most current browsers. (IE8/9/10/11, Chrome, Firefox, Safari, etc.). The bottom layer relies on the lightweight vector graphics library ZRender to provide intuitive, interactive, and highly customizable data visualization charts.

Rich visualization types

ECharts provides conventional line charts, bar charts, scatter charts, pie charts, K-line charts, and box charts for statistics Charts, maps, heat maps, line charts for geographic data visualization, relationship diagrams, treemaps, sunburst charts for relational data visualization, parallel coordinates for multidimensional data visualization, and funnel charts and dashboards for BI, and support A mix of images.

In addition to the built-in charts that contain rich functions, ECharts also provides custom series. You only need to pass in a renderItem function to map the data to any graphics you want. What’s even better is These can also be used in conjunction with existing interactive components without having to worry about other things.

You can download the build file containing all charts in the download interface. If you only need one or two charts, but the build file containing all charts is too large, you can also select the required chart type in the online build. Post custom build.

Multiple data formats can be used directly without conversion

ECharts built-in dataset attribute (4.0+) supports direct input of multiple data formats including two-dimensional tables, key-value, etc. Format data sources, mapping from data to graphics can be completed by simply setting the encode attribute. This method is more in line with visual intuition, eliminating the steps of data conversion in most scenarios, and multiple components can share a copy data without cloning.

In order to cope with the display of large amounts of data, ECharts also supports inputting data in TypedArray format. TypedArray can occupy less memory when storing large amounts of data, and its GC-friendly features can also greatly improve visual applications. performance.

Front-end display of tens of millions of data

Through incremental rendering technology (4.0+) and various meticulous optimizations, ECharts can display tens of millions of data , and at this data level, smooth zoom and pan interactions can still be performed.

Even if binary storage is used for tens of millions of geographical coordinate data, it will take up hundreds of MB of space. Therefore, ECharts also provides support for streaming loading (4.0+). You can use WebSocket or load the data in chunks, and render as much as you load! No need to wait long for all data to load before drawing.

Mobile optimization

ECharts has made detailed optimizations for mobile interaction. For example, on a small mobile screen, it is suitable to use your fingers to zoom and pan in the coordinate system. On the PC side, you can also use the mouse to zoom (use the mouse wheel), pan, etc. in the picture.

The fine-grained modularization and packaging mechanism allows ECharts to have a small size on the mobile terminal. The optional SVG rendering module makes the memory usage of the mobile terminal no longer stretched.

Multiple rendering solutions, cross-platform use!

ECharts supports rendering charts in the form of Canvas, SVG (4.0+), and VML. VML is compatible with lower versions of IE, SVG makes mobile terminals no longer worry about memory, and Canvas can easily handle the display of large amounts of data and special effects. Different rendering methods provide more choices, allowing ECharts to perform better in various scenarios.

In addition to PC and mobile browsers, ECharts can also cooperate with node-canvas for efficient server-side rendering (SSR) on node. Starting from 4.0, we have also cooperated with the WeChat applet team to provide ECharts adaptation to the applet!

Enthusiastic contributors in the community have also provided us with a wealth of other language extensions, such as Python's pyecharts, R language's recharts, Julia's ECharts.jl and so on.

We hope that neither platform nor language will become a limitation for everyone to use ECharts to achieve visualization!

In-depth interactive data exploration

Interaction is an important means to discover information from data. "Overview first, zoom and filter to view details as needed" is the basic requirement for data visualization interaction.

ECharts has been moving forward on the road of interaction. We provide out-of-the-box interactive components such as legends, visual mapping, data area zoom, tooltip, and data brush selection, which can filter data in multiple dimensions. Interactive operations such as view zoom and display details.

Multi-dimensional data support and rich visual coding methods

ECharts 3 began to strengthen support for multidimensional data. In addition to adding common multi-dimensional data visualization tools such as parallel coordinates, for traditional scatter plots, etc., the incoming data can also be multi-dimensional. With the rich visual coding provided by the visual mapping component visualMap, data of different dimensions can be mapped to different visual channels such as color, size, transparency, brightness, etc.

Dynamic Data

ECharts is driven by data, and changes in data drive changes in chart display. Therefore, the implementation of dynamic data has become extremely simple. You only need to obtain the data and fill in the data. ECharts will find the difference between the two sets of data and then express the changes in the data through appropriate animations. With the timeline component, data information can be expressed in a higher time dimension.

Gorgeous special effects

ECharts provides eye-catching special effects for the visualization of line data, point data and other geographical data.

Achieve more powerful and gorgeous three-dimensional visualization through GL

Want to achieve three-dimensional visualization effects in VR and large-screen scenes? We provide ECharts GL based on WebGL. You can use ECharts GL to draw three-dimensional histograms of the earth, buildings, and population distribution just as easily as using ordinary ECharts components. On this basis, we also provide different levels of pictures. Configuration items, you can get an artistic picture with just a few lines of configuration!

##Accessibility (4.0 +)

When we talk about "visualization", we often naturally associate it with "seeing", but in fact this is one-sided. W3C has developed the Accessible Rich Internet Applications Suite (WAI-ARIA), which is dedicated to making web content and web applications accessible to more people with disabilities.

ECharts 4.0 complies with this specification and supports automatic and intelligent generation of descriptions based on chart configuration items, so that blind people can understand the content of the chart with the help of a reading device, making the chart accessible to more people!

For more related knowledge, please visit

PHP Chinese website! !

The above is the detailed content of What are ECharts?. For more information, please follow other related articles on the PHP Chinese website!