柱状图加折线图 柏拉图 echarts
2024-01-08 15:24:02
配置项
var colors = ['#C33531','#EFE42A','#64BD3D','#EE9201','#29AAE3', '#B74AE5','#0AAF9F','#E89589']
option = {
tooltip : {
trigger : 'axis',
axisPointer : { // 坐标轴指示器,坐标轴触发有效
type : 'line' // 默认为直线,可选为:'line' | 'shadow'
},
formatter : function(params) {
return params[0].name + '<br/>' + params[0].seriesName + ' : '
+ params[0].value + '<br/>' + params[1].seriesName + ' : '
+ (params[1].value + params[0].value);
}
},
legend : {
selectedMode : false,
data : ['数量', '百分比']
},
xAxis : [{
type : 'category',
data : ['不良品1', '不良品2', '不良品3', '不良品4', '不良品5', '不良品6']
}, {
type : 'category',
show : false,
boundaryGap : false,
data : ['Cosco', 'CMA', 'APL', 'OOCL', 'Wanhai', 'Zim', "333"]
}],
yAxis : [{
type : 'value',
boundaryGap : [0, 0.1],
splitLine : false
}, {
type : 'value',
name : '百分比',
axisLabel : {
formatter : '{value} %'
},
splitLine : false
}],
series : [{
name : '数量',
type : 'bar',
barCategoryGap : '0%',
itemStyle : {
normal : {
color : function(obj) {
if (obj.dataIndex >= 0) {
return colors[obj.dataIndex];
}
},
}
},
data : [300, 200, 180, 150, 120, 50]
}, {
name : '百分比',
type : 'line',
xAxisIndex : 1,
yAxisIndex : 1,
data : [86, 90, 91, 92, 95, 98, 100]
}
]
};
文章来源:https://blog.csdn.net/weixin_45652891/article/details/135411228
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符,请联系我的编程经验分享网邮箱:veading@qq.com进行投诉反馈,一经查实,立即删除!
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符,请联系我的编程经验分享网邮箱:veading@qq.com进行投诉反馈,一经查实,立即删除!