设置后的效果图,数据大于100000小于200000的柱图的颜色为黄色,数据大于200000的柱图的颜色为红色,指标值小于100000的柱图的颜色为灰色
思路
1)在“分析展现”中新建仪表分析,数据如下
2)新建客户端宏
3)宏代码如下,在宏代码中所示设置柱子指标值小于4000为红色,指标值大于4000小于6000为黄色:
function main(chartView) { var chart = chartView.getChartObject(); //获取图形对象 var options = chart.getOptions(); var series = options.series; var datas = []; for (var j in series) { if (series[j].type == "bar") { datas = series[j].data; //获取柱子信息 } } for (var i in datas) { var value = parseInt(datas[i].value[1]); datas[i].itemStyle = datas[i].itemStyle || {}; if (value < 200000 && value > 100000) { //设置柱子的指标值大于100000小于200000的柱图的颜色为黄色 datas[i].itemStyle = { "normal": { "color": "#FFFF66" } } } else if (value > 200000) { //设置柱子的指标值大于200000的柱图的颜色为红色 datas[i].itemStyle = { "normal": { "color": "#FF0033" } } } else { //设置柱子的指标值小于100000的柱图的颜色为灰色 datas[i].itemStyle = { "normal": { "color": "#7A7A7A" } } } } }
客户端效果图: