85 lines
1.5 KiB
JavaScript
85 lines
1.5 KiB
JavaScript
|
layui.use(['echarts'], function() {
|
|||
|
|
let echarts = layui.echarts;
|
|||
|
|
var column4 = echarts.init(document.getElementById('column4'),null, {
|
|||
|
|
width: 600,
|
|||
|
|
height: 400
|
|||
|
|
});
|
|||
|
|
option = {
|
|||
|
|
backgroundColor:'#fff',
|
|||
|
|
title:{
|
|||
|
|
text:"描边柱状图",
|
|||
|
|
top:10,
|
|||
|
|
left:15,
|
|||
|
|
color:"#35598d",
|
|||
|
|
fontSize:16,
|
|||
|
|
fontWeight:'normal'
|
|||
|
|
},
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'axis',
|
|||
|
|
formatter:'{b}：{c}',
|
|||
|
|
},
|
|||
|
|
grid: {
|
|||
|
|
left: '5%',
|
|||
|
|
right: '6%',
|
|||
|
|
bottom: '3%',
|
|||
|
|
top: '20%',
|
|||
|
|
containLabel: true
|
|||
|
|
},
|
|||
|
|
xAxis :{
|
|||
|
|
type : 'category',
|
|||
|
|
data : ['策略1','策略2','策略3','策略4','策略5','策略6','策略7','策略8','策略9'],
|
|||
|
|
axisLabel:{ //坐标轴字体颜色
|
|||
|
|
color: '#9eaaba'
|
|||
|
|
},
|
|||
|
|
axisLine:{
|
|||
|
|
lineStyle:{
|
|||
|
|
color:"#e5e5e5"
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
axisTick:{ //y轴刻度线
|
|||
|
|
show:false
|
|||
|
|
},
|
|||
|
|
splitLine:{ //网格
|
|||
|
|
show: false,
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
yAxis :{
|
|||
|
|
type : 'value',
|
|||
|
|
axisLabel:{ //坐标轴字体颜色
|
|||
|
|
color: '#9eaaba'
|
|||
|
|
},
|
|||
|
|
axisLine:{
|
|||
|
|
show:false,
|
|||
|
|
},
|
|||
|
|
axisTick:{ //y轴刻度线
|
|||
|
|
show:false
|
|||
|
|
},
|
|||
|
|
splitLine:{ //网格
|
|||
|
|
show: true,
|
|||
|
|
lineStyle:{
|
|||
|
|
color:'#dadde4',
|
|||
|
|
type:"dashed" //坐标网线类型
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
series:{
|
|||
|
|
name:'',
|
|||
|
|
type:'bar',
|
|||
|
|
barWidth : '40%', //柱子宽度
|
|||
|
|
itemStyle:{ //柱子颜色
|
|||
|
|
borderWidth: 2,
|
|||
|
|
borderColor: 'rgb(79, 116, 223)',
|
|||
|
|
color:'rgba(79, 116, 223, .3)',
|
|||
|
|
},
|
|||
|
|
data:[320, 332, 301, 334, 390, 330, 320, 230, 156]
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
column4.setOption(option);
|
|||
|
|
|
|||
|
|
window.onresize = function() {
|
|||
|
|
column4.resize();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
})
|