莆仙生活网
当前位置: 莆仙生活网 > 知识库 >

echarts自适应

时间:2025-02-10 00:55:01 编辑:莆仙君

echarts图表怎么自适应屏幕大小

通过js设置自适应
$(function(){
//自适应设置
width = $(window).width();
height = $(window).height();
//设置图表大小

$("#mainBar").css("width",width-40);
$("#mainBar").css("height",height-40);
//初始化图标

setEcharts();
});

$(window).resize(function() {
width = $(window).width();
height = $(window).height();
$("#mainBar").css("width",width-40);
$("#mainBar").css("height",height-40);
});


echarts图表怎么自适应屏幕大小

jquery ba-resize监听他的container。

// 为echarts对象加载数据
myChart.setOption(option);
// window.onresize = myChart.resize;
$("#dcDataUseStatisticContainer").resize(function(){
$(myChart).resize();
})