解决echart(1.4.1) 柱形图不能随着值改变颜色的问题

时间:2022-09-15 10:40:38

Echart1.4.1效果图

解决echart(1.4.1) 柱形图不能随着值改变颜色的问题 解决echart(1.4.1) 柱形图不能随着值改变颜色的问题 解决echart(1.4.1) 柱形图不能随着值改变颜色的问题

解决echart(1.4.1) 柱形图不能随着值改变颜色的问题


如果是最新的2.2.7,大家可以参照官网提供的http://echarts.baidu.com/doc/example/bar15.html 

如果是1.4.1,那么color中如果写function(params),params没有向2.2.7中那么多的参数,如果还要颜色随值变化,可以这样处理

var zrColor = require('zrender/tool/color');

解决echart(1.4.1) 柱形图不能随着值改变颜色的问题

var colorNo=0;
//设置柱状图
function setColumnChart(x_value,y_value,colorBegin,colorEnd){
option_column.xAxis[0].data=x_value;
option_column.series[0].data=y_value;
option_column.series[0].itemStyle.normal.color= function(params) {
//获取两种颜色之间渐变颜色数组
var colorList = zrColor.getStepColors(colorBegin,colorEnd, 100);
//获取数组中第几个值
var item=parseInt(y_value[colorNo]);
var curColor=colorList[item];
//用于遍历数值数组
colorNo++;
//遍历完成数值,重置控制变量
if(colorNo==y_value.length){
colorNo=0;
}
return curColor;
}
myChart_column.setOption(option_column);
}