0
点赞
收藏
分享

微信扫一扫

echart-额外添加事件,数据不同显示不同颜色

效果:

点击圆点,获取数据,并触发事件

echart-额外添加事件,数据不同显示不同颜色_html

 

 

 利用on得方式添加事件(点击,双击.....等)额外事件

var echartDom = echarts.init(document.getElementById('echart'));
echartDom.setOption(option); //配置项option
//添加点击事件
echartDom.on('click', function (params) {
console.log(params)
$('.table').show();
$('.name').html(params['data'][2])
})

 

不同区域显示不同颜色

series: [
{
name: 'I',
type: 'scatter',
xAxisIndex: 0,
yAxisIndex: 0,
data: data,
encode: { tooltip: [0, 1] },
markLine: markLineOpt,
itemStyle: {
normal: {
color: function (params) {
//不同区域,显示不同颜色
var c = params.data;
if (c[0] > 50 && c[1] <= 50) {
return "#FE8463";
} else if (c[0] > 50 && c[1] > 50) {
return "#27727B";
} else if (c[0] <= 50 && c[1] <= 50) {
return "#9BCA63";
}
return "#ff9d9b";
}
}
}

},
]

  



举报

相关推荐

0 条评论