实现echarts图表自适应
if (!this.echarts.analysisAmplificationChart) {
document.getElementById('analysisAmplificationChart').style.width = (window.innerWidth * 0.48) + "px" //初始化echarts图表宽度
this.echarts.analysisAmplificationChart = echarts.init(document.getElementById('analysisAmplificationChart'), 'macarons', {
renderer: "svg",
})
window.onresize = function () {
twChart.resize();
}
}
this.echarts.analysisAmplificationChart.setOption({
tooltip: {
trigger: 'item',
axisPointer: {
type: 'cross',
label:{
backgroundColor:'#6a7985'
}
},
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
// toolbox: {
// feature: {
// saveAsImage: {}
// }
// },
xAxis: {
type: 'category',
boundaryGap: false,
data: xAxisData
},
yAxis: {
type: 'value'
},
dataZoom: [
{
type:'slider', //图标下面的伸缩条
show:true, // 是否显示
realtime:true, // 拖动时更新视图
start:0, //滚动条 开始位置(0-100)
end:100, //滚动条结束位置(0-100)
height:10 //滚动条高度
},
{
type: 'inside',
orient: 'vertical',
filterMode: 'none',
start: 0,
end: 100
},
{
type: 'inside',
orient: 'horizontal',
filterMode: 'none',
start: 0,
end: 100
}
],
series: seriesData
}, true)