您的位置:首页 > Web前端 > CSS

echars-为series里面每个数据单独定义样式

2017-04-20 10:53 246 查看
1.给柱状图的每根柱状单独定义颜色(方法一)

series : [ {
name : legend_data[0],
type : 'bar',
label : {
normal : {
show : true,
position : 'insideBottom',
textStyle : { color  : 'black' },
formatter : '{c}'
}
},
barWidth : 70,//柱子宽度
//data : values_1  //一起定义
data : [{value : values_1[0],  itemStyle : { normal : { color : '#9bbb59' } } },//单独定义
{value : values_1[1],  itemStyle : { normal : { color : '#c0504d' } } },
{value : values_1[2],  itemStyle : { normal : { color : '#4f81bd' } } },
]

}

2、方法二

var original_values_1 = data.customersList;
/*var original_values_1 = [ 46478, 47509, 50118, 50773, 50843, 54804, 54853,
57280, 63455, 136907 ];*/
var colors_1 = [ '#7030a0', '#002060', '#0070c0', '#00b0f0', '#f79646',
'#4bacc6', '#8064a2', '#9bbb59', '#c0504d', '#4f81bd' ];
var values_1 = [];
if(original_values_1 == ''){
values_1.push('');
}else{
for (var i = 0; i < original_values_1.length; i++) {
the_value = toDecimal4(original_values_1[i] / 10000);
//the_value = (Math.round(original_values_1[i] / 10000*10000) / 10000);
values_1.push({
value : the_value,
itemStyle : {
normal : {
color : colors_1[i]  //为每个数据赋予单独颜色
}
}
});
}
}


3.单独设置显示位置

data : [{value : values_2[0]},
{value : values_2[1], label : { normal : { position : [-75,-5] } } }, {value : values_2[2], label : { normal : { position : [40 ,-5] } } }
]
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐