0


Echarts图表笔记one

三种方式设置图表容器大小

one:
直接在div中设置大小 (该设置下图表的大小即为div的大小,除非声明opts.width或opts.height将其覆盖)

<div id="main" style="width:600px;height:400px"></div>

two:
初始化的时候设置大小 (应用场景:容器不存在宽高或者你希望图表的宽高大小不等于容器的宽高大小)

var myChart = echarts.init(document.getElementById('main'),null,{
    width:600,
    height:400});

three:
响应式的设置容器大小 (应用场景:希望当容器大小改变时,图表的大小也相应的改变)

var myChart = echarts.init(document.getElementById('main'));//监听页面的 window.onresize 事件获取浏览器大小改变的事件,//然后调用 echartsInstance.resize 改变图表的大小
  window.onresize=function(){
    myChart.resize({
      width:600,
        height:400});

本文转载自: https://blog.csdn.net/qq_43730595/article/details/122113198
版权归原作者 y∩__∩y 归来 所有, 如有侵权,请联系我们删除。

“Echarts图表笔记one”的评论:

还没有评论