YouTip

!(#) ECharts is an open source visualization library implemented with JavaScript, covering charts for various industries and meeting various needs. ECharts provides a rich variety of chart types and interactive capabilities, enabling users to generate various charts through simple configuration, including but not limited to line charts, bar charts, scatter plots, pie charts, radar charts, maps, etc. ECharts follows the Apache-2.0 open source license and is free for commercial use. ECharts is compatible with most current browsers (IE8/9/10/11, Chrome, Firefox, Safari, etc.) and compatible with multiple devices, allowing for flexible display anytime and anywhere. To read this tutorial, you need the following foundation: ## Examples // Initialize echarts instance based on prepared DOM var myChart = echarts.init(document.getElementById('main')); // Specify chart configuration and data var option = { title: { text: 'First ECharts Instance' }, tooltip: {}, legend: { data:['Sales Volume'] }, xAxis: { data: ["Shirt","Wool Sweater","Chiffon Blouse","Pants","High Heels","Socks"] }, yAxis: {}, series: [{ name: 'Sales Volume', type: 'bar', data: [5, 20, 36, 10, 10, 20] }] }; // Display chart using the specified configuration and data. myChart.setOption(option); [Try it »](#) Click the "Try it" button to view the online example ECharts includes the following features: * **Rich Visualization Types**: Provides regular line charts, bar charts, scatter plots, pie charts, K-line charts, box plots for statistics, maps, heat maps, line maps for geographic data visualization, relationship maps, treemaps, sunbursts for relationship data visualization, parallel coordinates for multidimensional data visualization, as well as funnel charts and gauges for BI, and supports mixing multiple charts. * **Multiple Data Formats Without Conversion**: The built-in dataset attribute (4.0+) supports directly passing in various data source formats including two-dimensional tables, key-value, etc., and also supports inputting data in TypedArray format. * **Frontend Display of Million-Level Data**: Through incremental rendering technology (4.0+), combined with various detailed optimizations, ECharts can display data of tens of millions. * **Mobile Optimization**: Detailed optimizations have been made for mobile interaction, such as suitable for finger zooming and panning on the coordinate system on small mobile screens. On PC, you can also use the mouse to zoom (mouse wheel) and pan in the chart. * **Multiple Rendering Schemes, Cross-Platform Use**: Supports rendering charts in the form of Canvas, SVG (4.0+), and VML. * **Deep Interactive Data Exploration**: Provides out-of-the-box interactive components such as legend, visual mapping, data area zoom, tooltip, data brush selection, which can perform multi-dimensional data filtering, view zooming, detail display and other interactive operations on data. * **Support for Multidimensional Data and Rich Visual Encoding**: For traditional scatter plots and others, the input data can also be multiple dimensions. * **Dynamic Data**: Changes in data drive changes in chart display. * **Gorgeous Effects**: Provides eye-catching effects for visualization of line data, point data and other geographic data. * **Achieve More and More Magnificent Three-Dimensional Visualization Through GL**: Realize three-dimensional visualization effects in VR and large screen scenarios. * **Accessibility (4.0+)**: Supports automatically intelligently generating descriptions based on chart configuration options, enabling blind people to understand chart content with the help of reading devices, making charts accessible to more people!