Echarts 实现点击更新图表（图标联动）

Echarts 实现点击更新图表（图标联动）

1. 因为需要，领导要求做一个统计页面，要能点击图表实现数据更新
2. 先上Demo

3.首先要在echarts 官网上下载最新的echarts,图中的圆角pie图和rose图就是最新版本的特性。
官网地址：Apache ECharts
4.html页面要加入三个div用来承载echarts的渲染，注意div一定要有高度，否则是渲染不出来的

 <div style="width:100%" id="initBar"></div>

我这里没写高度是因为我用的js动态设置它的高度达到自适应页面的要求
var winHeight = $(window).height();
$("#initBar").height(winHeight - 193);
5.js文件里先定义两个为null的对象
var initIndustryClassPieCharts = null;
var initConstructionNaturePieCharts = null;
6.定义和渲染echarts,有几个图标就写几个方法，需要动态渲染的图，方法要带参数名

function initIndustryClassPie(depemertId)
initConstructionNaturePie(depemertId, industryClass)

7.因为数据是动态获取的，所以这个参数要带入到后台去获取新的数据来达到更新的效果。
8.点击实现图表刷新

myChart.on('click', function (params) {
  //先把两个需要更新的图表销毁
  initConstructionNaturePieCharts.dispose();//这里的"initConstructionNaturePieCharts"就是上面的定义的对象
  initConstructionNaturePie(params.data.F_CompanyId, "");//执行重新获取；params里面就是你点击之后可以获取到的参数。
  //注意 销毁dispose 这一步是必须的。否则无法更新图表。
});

9.至此，联动效果就做好了