echarts点击事件使用

echarts点击事件使用_第1张图片

echarts可以通过点击事件获取每项的值:myChart.on('click', function (param) { } // myChart为自定义变量:var myChart = echarts.init(document.getElementById('echartBox'));

可以通过param获取如下:

//param参数包含的内容有: 
//param.name:X轴的值 
//param.data:Y轴的值 
//param.value:Y轴的值 
//param.type:点击事件均为click 
//param.seriesName:legend的名称 
//param.seriesIndex:系列序号(series中当前图形是第几个图形第几个) 
//param.dataIndex:数值序列(X轴上当前点是第几个点)
 //alert(param.seriesName);  //legend的名称

 也可以在option的series里面自定义参数,然后通过option.series[param.seriesIndex].barIds[param.dataIndex])获取自定义的参数(barIds为自定义的参数),如下

option = {
    series:{
       name:'蒸发量',
       type:'bar',
 //添加了barIds参数(自定义的)
       barIds: ['1月1','2月2','3月3','4月4','5月5','6月6','7月7','8月8','9月9','10月10','11月11','12月12'], 
       data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
    }
}
myChart.on('click', function (param) { 
//获取自定义变量barIds的值,barIds要和option的series里自定义的一样
  alert(option.series[param.seriesIndex].barIds[param.dataIndex])

});


    
        
        点击echarts圆柱体事件
        
    
    
        

 

你可能感兴趣的:(前端,echarts,javascript,ecmascript)