echarts如何改变图表的宽高

2026-02-07 09:31:49

1、echarts图表生成时,会出现图表展示不完全地现象,此时我们需要调整一下图表地宽度与高度,将图表更好地展示出来。这其中柱图与饼图地宽高调整又不一样

echarts如何改变图表的宽高

2、柱图的宽高调整,只需要在option添加grid属性即可,如图红框内添加:

   grid:{

       //与绝对定位相似,top,left,right,bottom 设定是根据上级盒子宽高来计算

        top:"10%",

        left:"10%",

        right:"20%",

        bottom:"10%"

    }

数值根据自己需要来定,可以是“%”或数字

echarts如何改变图表的宽高

echarts如何改变图表的宽高

3、饼图的宽高,在echarts中决定饼图大小的是直径radius,而不是宽高(饼图无总体宽高属性),如图红框内改变即可:radius: "50%",//普通饼图,而环形图应该设置为:radius: ["50%","70%"]

与柱图相似,radius数值的取决于上级盒子的宽高

echarts如何改变图表的宽高

echarts如何改变图表的宽高

echarts如何改变图表的宽高

echarts如何改变图表的宽高

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢