Echarts柱形图与条形图自定义样式
huanBiDataFun1() {
const huanBiData1 = echarts.init(document.getElementById('huanBiData1'))
huanBiData1.setOption({
color: ['#5697FD', '#FD1919'],
title: {
text: '环比数据',
left: 'left',
textStyle: { 'fontSize': 14, 'fontWeight': '500', 'color': '#0E1313' }
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
crossStyle: {
color: '#999'
}
}
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
legend: {
data: ['空气质量指数', '环比增长率'],
right: 50,
top: 25,
icon: 'rect', // 形状 类型包括 circle,rect,line,roundRect,triangle,diamond,pin,arrow,none
itemWidth: 20, // 设置宽度
itemHeight: 9, // 设置高度
itemGap: 20 // 设置间距
},
xAxis: [
{
type: 'category',
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
axisPointer: {
type: 'shadow'
}
}
],
yAxis: [
{
type: 'value',
// name: '水量',
min: 0,
max: 250,
interval: 50,
axisLabel: {
formatter: '{value} ml'
}
},
{
type: 'value',
// name: '温度',
min: 0,
max: 25,
interval: 5,
axisLabel: {
formatter: '{value}'
}
}
],
series: [
{
name: '空气质量指数',
type: 'bar',
data: [2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
},
{
name: '环比增长率',
type: 'line',
// yAxisIndex: 1,
data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
}
]
})
setTimeout(() => {
window.addEventListener('resize', function() {
huanBiData1.resize()
})
}, 50)
},