echarts x轴坐标文字显示不全

最新推荐文章于 2024-08-07 16:25:32 发布

mrAwei

最新推荐文章于 2024-08-07 16:25:32 发布

阅读量739

点赞数

本文链接：https://blog.csdn.net/mr_awei/article/details/78783904

版权

在echarts中应用柱状图或者折线图时，当数据量过多的时候，会出现X轴的坐标就会显示不全的问题(如下图)，

一番搜索之后了解到"在ECharts图表组件内部有一个机制，用于统计xAxis坐标刻度的个数和图表宽度，从而会自动调整刻度间隔个数以此达到刻度相互之间不致于很拥挤而影响图表欣赏性。刻度间隔的相关属性就是：interval,还有一个属性：rotate: number 度角是倾斜的控制所在。"

具体修改如下将：

xAxis: {
            	type : 'category',
                data: [<?php echo implode(",", $lin);?>]
            },

改为：

	    grid: {  
                y2: 140  
            }, 
            xAxis: {
            	type : 'category',
                data: [<?php echo implode(",", $lin);?>],
                axisLabel:{  
                         interval:0,//横轴信息全部显示  
                         rotate:-30,//-30度角倾斜显示  
                }  
            },