echarts中seriess数据量大的展示问题

问题遇到的现象和发生背景

是这样的现在X轴的刻度为12个，但是想要展示的数据却是70多个，如何处理

xAxis: [{
type: "category",
data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
splitNumber: 3
}],
yAxis: [{
type: "value"
}],
series: [{
name: "直接访问",
type: "bar",
barWidth: "60%",
data: [1,2,3,4,5,6,7,8,9,10,12,12,13,141,12,3,321,213,213]
}]

echarts里面有专门处理大数据得图表 数据集 当让 你也可以加上一个属性

{
title:[{
text:'总单数(各个商户占比)',
left:'2%',
top:'1%',
textStyle:{
fontSize:18,
fontWeight:700,
}
},{
show: this.countBrandShopData.countList.length ? false : true,
subtext:'暂无数据',
subtextStyle:{
color:'#bbb',
fontWeight:350,
fontSize:25
},
left:'40%',
top:'40%'
}],
tooltip: {
trigger: 'item',
extraCssText:'height:60px;'
},
grid: {
bottom: 90
},
dataZoom: [
{
type: 'inside'
},
{
type: 'slider'
}
],
xAxis: {
silent: false,
splitLine: {
show: false
},
splitArea: {
show: false
},
data: this.countBrandShopData.countList
},
yAxis: {
splitArea: {
show: false
}
},
series: [
{
type: 'bar',
itemStyle: {
color: '#81F4D5'
},
data: this.countBrandShopData.countList,
large: true
}
]
}
可以直接用我这个配置 你把数据源改一下就ok

X轴的刻度不应该按照展示的数据来么？

你这12个刻度，72个数据，那么数据应该是分6类吧，我看你是做柱图的，不过不分类就只能做散点图了，给个柱图的参考例子：

option = {
  title: {
    text: 'CPU 数据'
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: {
    data: ['Rainfall', 'Evaporation']
  },
  toolbox: {
    show: true,
    feature: {
      dataView: { show: true, readOnly: false },
      magicType: { show: true, type: ['line', 'bar'] },
      restore: { show: true },
      saveAsImage: { show: true }
    }
  },
  calculable: true,
  xAxis: [
    {
      type: 'category',
      data: ['12:05', '12:10','12:15','12:20','12.25','12:30','12:35','12:40','12:45','12:50','12:55','13:00']
    }
  ],
  yAxis: [
    {
      type: 'value'
    }
  ],
  series: [
    {
      name: '数据1',
      type: 'bar',
      data: [1,2,3,4,5,6,7,1,2,3,4,5],
      markPoint: {
        data: [
          { type: 'max', name: 'Max' },
          { type: 'min', name: 'Min' }
        ]
      },
      markLine: {
        data: [{ type: 'average', name: 'Avg' }]
      }
    },
    {
      name: '数据2',
      type: 'bar',
      data: [56,6,6,1,2,1,1,1,2,3,4,5,6,7],
      markPoint: {
        data: [
          { type: 'max', name: 'Max' },
          { type: 'min', name: 'Min' }
        ]
      },
      markLine: {
        data: [{ type: 'average', name: 'Avg' }]
      }
    },
    {
      name: '数据3',
      type: 'bar',
      data: [1,2,3,4,5,56,6,6,1,2,1,1],
      markPoint: {
        data: [
          { type: 'max', name: 'Max' },
          { type: 'min', name: 'Min' }
        ]
      },
      markLine: {
        data: [{ type: 'average', name: 'Avg' }]
      }
    },
    {
      name: '数据4',
      type: 'bar',
      data: [1,1,2,3,4,5,6,7,1,2,3,4],
      markPoint: {
        data: [
          { type: 'max', name: 'Max' },
          { type: 'min', name: 'Min' }
        ]
      },
      markLine: {
        data: [{ type: 'average', name: 'Avg' }]
      }
    },
    {
      name: '数据5',
      type: 'bar',
      data: [4,5,6,7,1,2,3,4,5,56,6,6],
      markPoint: {
        data: [
          { type: 'max', name: 'Max' },
          { type: 'min', name: 'Min' }
        ]
      },
      markLine: {
        data: [{ type: 'average', name: 'Avg' }]
      }
    },
    {
      name: '数据6',
      type: 'bar',
      data: [1,2,1,1,1,1,2,3,4,5,6,7],
      markPoint: {
        data: [
          { type: 'max', name: 'Max' },
          { type: 'min', name: 'Min' }
        ]
      },
      markLine: {
        data: [{ type: 'average', name: 'Avg' }]
      }
    }
  ]
};

img