ECharts交互组件ECharts提供了很多交互组件：例组件legend、标题组件title、视觉映射组件visualMap、数据区域缩放组件dataZoom、时间线组件timeline。接下来的内容我们将介绍如何使用数据区域缩放组件dataZoom。dataZoomdataZoom组件可以实现通过鼠标滚轮滚动，放大缩小图表的功能。默认情况下dataZoom控制x轴，即对x轴进行数据窗口缩放和数据窗口平移操作。实例option={ xAxis:{ type:'value' }, yAxis:{ type:'value' }, dataZoom:[ { //这个da
ECharts交互组件ECharts提供了很多交互组件：例组件legend、标题组件title、视觉映射组件visualMap、数据区域缩放组件dataZoom、时间线组件timeline。接下来的内容我们将介绍如何使用数据区域缩放组件dataZoom。dataZoomdataZoom组件可以实现通过鼠标滚轮滚动，放大缩小图表的功能。默认情况下dataZoom控制x轴，即对x轴进行数据窗口缩放和数据窗口平移操作。实例option={ xAxis:{ type:'value' }, yAxis:{ type:'value' }, dataZoom:[ { //这个da
ECharts数据集（dataset）ECharts使用dataset管理数据。dataset组件用于单独的数据集声明，从而数据可以单独管理，被多个组件复用，并且可以基于数据指定数据到视觉的映射。下面是一个最简单的dataset的例子：实例option={ legend:{}, tooltip:{}, dataset:{ //提供一份数据。 source:[ ['product','2015','2016','2017'], ['MatchaLatte',43.3,85.8,93.7], ['MilkTea',83.1,73.4,55.1],
ECharts数据集（dataset）ECharts使用dataset管理数据。dataset组件用于单独的数据集声明，从而数据可以单独管理，被多个组件复用，并且可以基于数据指定数据到视觉的映射。下面是一个最简单的dataset的例子：实例option={ legend:{}, tooltip:{}, dataset:{ //提供一份数据。 source:[ ['product','2015','2016','2017'], ['MatchaLatte',43.3,85.8,93.7], ['MilkTea',83.1,73.4,55.1],
ECharts异步加载数据ECharts通常数据设置在setOption中，如果我们需要异步加载数据，可以配合jQuery等工具，在异步获取数据后通过setOption填入数据和配置项就行。ECharts通常数据设置在setOption中，如果我们需要异步加载数据，可以配合jQuery等工具，在异步获取数据后通过setOption填入数据和配置项就行。json数据：echarts_test_data.json数据：{ "data_pie":[ {"value":235,"name":"视频广告"}, {"value":274,"name":"联盟广告"}, {"value":310,"
ECharts异步加载数据ECharts通常数据设置在setOption中，如果我们需要异步加载数据，可以配合jQuery等工具，在异步获取数据后通过setOption填入数据和配置项就行。ECharts通常数据设置在setOption中，如果我们需要异步加载数据，可以配合jQuery等工具，在异步获取数据后通过setOption填入数据和配置项就行。json数据：echarts_test_data.json数据：{ "data_pie":[ {"value":235,"name":"视频广告"}, {"value":274,"name":"联盟广告"}, {"value":310,"
ECharts样式设置ECharts可以通过样式设置来改变图形元素或者文字的颜色、明暗、大小等。颜色主题ECharts4开始，除了默认主题外，内置了两套主题，分别为light和dark。使用方式如下：实例varchart=echarts.init(dom,'light');或者varchart=echarts.init(dom,'dark');尝试一下»另外，我们也可以在官方的主题编辑器选择自己喜欢的主题下载。目前主题下载提供了JS版本和JSON版本。如果你使用JS版本，可以将JS主题代码保存一个主题名.js文件，然后在HTML中引用该文件，最后在代码中使用该主题。比如上图中我们选中了一个主题
ECharts样式设置ECharts可以通过样式设置来改变图形元素或者文字的颜色、明暗、大小等。颜色主题ECharts4开始，除了默认主题外，内置了两套主题，分别为light和dark。使用方式如下：实例varchart=echarts.init(dom,'light');或者varchart=echarts.init(dom,'dark');尝试一下»另外，我们也可以在官方的主题编辑器选择自己喜欢的主题下载。目前主题下载提供了JS版本和JSON版本。如果你使用JS版本，可以将JS主题代码保存一个主题名.js文件，然后在HTML中引用该文件，最后在代码中使用该主题。比如上图中我们选中了一个主题
ECharts饼图前面的章节我们已经学会了使用ECharts绘制一个简单的柱状图，本章节我们将绘制饼图。饼图主要是通过扇形的弧度表现不同类目的数据在总和中的占比，它的数据格式比柱状图更简单，只有一维的数值，不需要给类目。因为不在直角坐标系上，所以也不需要xAxis，yAxis。实例myChart.setOption({series:[{name:'访问来源',type:'pie',//设置图表类型为饼图radius:'55%',//饼图的半径，外半径为可视区尺寸（容器高宽中较小一项）的55%长度。data:[//数据数组，name为数据项名称，value为数据项值{value:235,name
ECharts饼图前面的章节我们已经学会了使用ECharts绘制一个简单的柱状图，本章节我们将绘制饼图。饼图主要是通过扇形的弧度表现不同类目的数据在总和中的占比，它的数据格式比柱状图更简单，只有一维的数值，不需要给类目。因为不在直角坐标系上，所以也不需要xAxis，yAxis。实例myChart.setOption({series:[{name:'访问来源',type:'pie',//设置图表类型为饼图radius:'55%',//饼图的半径，外半径为可视区尺寸（容器高宽中较小一项）的55%长度。data:[//数据数组，name为数据项名称，value为数据项值{value:235,name
