Highcharts，如何消除 x 坐标上的间隙答案

【问题标题】：Highcharts, How to remove gaps on x coordinatesHighcharts，如何消除 x 坐标上的间隙
【发布时间】：2021-09-04 13:17:13
【问题描述】：

对于Highcharts样条类型图表，我想完全去掉左右空格。

我尝试更改一些选项，但没有成功。间距键和边距键没有进行任何外观更改。

谁有关于如何删除空格的任何信息，欢迎所有帮助。

Example chart

Highcharts.chart('container', {
  title: {
    text: ''
  },
  chart: {
    type: 'spline',
  },
  legend: {
    display: false
  },
  xAxis: {
    categories: [7, 13, 16, 18, 19, 20, 29, 22, 25, 38, 23, 26, 28, 29, 33],
  },
  yAxis: {
    tickPosition: 'inside',
    min: 0,
    title: {
      text: null
    },
    floor: 0,
    tickWidth: 1
  },
  series: [{
    name: 'John',
    data: [5, 3, 4, 7, 2]
  }, {
    name: 'Jane',
    data: [2, 2, 3, 2, 1]
  }, {
    name: 'Joe',
    data: [3, 4, 4, 2, 5]
  }]
});

<script src="https://code.highcharts.com/highcharts.js"></script>

<div id="container" style="height: 400px; width: 500px"></div>

【问题讨论】：

标签： javascript highcharts react-highcharts

【解决方案1】：

这些间隙是在使用 xAxis.categories 选项时添加的。如果您删除这些选项，那么它会按照您想要的方式工作。在这种情况下，对于刻度定位，最好设置其他可用的 API 选项。在此处了解更多信息：https://api.highcharts.com/highcharts/xAxis.tickPositions

【讨论】：