当信息比较多，或者文字比较长会如下展示：

可以清晰看到下方展示效果极差


修改后的效果如上，清晰明显
其中代码为：

 xAxis: [
                    {
                        data: this.names,
                        type: 'category',
                        axisLine: {
                            show: true,
                            lineStyle: {
                                type: 'dashed',
                                color: '#DEE6EC',
                            },
                        },
                        axisTick: {
                            show: false,
                        },
                        boundaryGap: true,
                        axisLabel: {
                            show: true,
                            color: '#666666',
                            fontSize: 12,
                            interval: this.names.length > 15 ? 3 : 0,   //主要设置其间隔，间隔为3
                        },
                    },
                ],

Echarts折线图展示时，如果横轴是按分钟展示数据，并且要一次展示一小时数据，那么横轴上会有60个标签，这样会导致数据会重叠在一起，展示效果不理想，此时可以横轴标签的间隔，比如每5分钟展示一个横轴标签，设置方式：

在echarts的脚本中，找到横轴标签处：

xAxis : [

                           {

                               type : 'category',

                               boundaryGap : false,

                               data : ${categoryData},//['周一','周二','周三','周四','周五','周六','周日']

                           axisLabel:{

                                     interval:4,

                               }

                           }

                       ],

在里边增加：

                           axisLabel:{

                                     interval:4,

                               }

表示每间隔4个点显示一个标签，展示效果如图：

问题

最近在做一个web的数据统计部分用到了Echart。可是在做柱状图（bar）时发现X轴的数据是隔一个显示的，如下图所示，找了半天没发现代码有什么问题，后面发现X轴的名称太长了，导致它默认就隔一个显示。

解决

1.设置相应属性----axisLabel

设置axisLabel中的interval为0

xAxis: {
	type: 'category',
	data: ['攻击模式', '应对措施', '入侵集合', '恶意软件', '工具', '脆弱性', '威胁主体', '攻击活动', '身份', '攻击指标', '可观察数据'],
	axisPointer: {
		type: 'shadow'
	},
	axisLabel: {
		interval: 0  //设置间隔为0
	}
}

2.将X轴数据倾斜显示

设置axisLabel中的rotate为45（代表逆时针旋转45度）

xAxis: {
	type: 'category',
	data: ['攻击模式', '应对措施', '入侵集合', '恶意软件', '工具', '脆弱性', '威胁主体', '攻击活动', '身份', '攻击指标', '可观察数据'],
	axisPointer: {
		type: 'shadow'
	},
	axisLabel: {
		rotate: 45, //代表逆时针旋转
	}
}