Highcharts 柱形图无间距错误的外部值

Question

使用 Highcharts，我想创建一个没有左/右间距的柱形图。为此，我发现一些帖子说将 xAxis min/max 设置为 0.25 并将项目数设置为 1.25，这似乎消除了水平间距。

但是，根据值，边缘上的列将上升到顶部，并且它们的标签将不再可见。

示例： 两个图表的唯一不同之处在于第一个图表的 xAxis 最小值/最大值设置为 0.25/2.75。 https://codepen.io/rolfboom/pen/qBvrQvZ

似乎这只发生在外部值，如果它们比其他值大（十分之一/百分之一），例如： [20,10,10,20] [100, 100, 100, 200]

我发现，如果我手动设置 yAxis 最大值（数据集的最大值），那么列会再次正确显示。

有谁知道这是一个错误还是我只是错误地使用了最小/最大？

上述 URL 中的 Codepen 代码： HTML

<script src="https://code.highcharts.com/11.3.0/highcharts.js"></script>
<div id="container1"></div>
<div id="container2"></div>

JS

Highcharts.chart('container1', {
  chart: {
    type: 'column',
  },
  title: {
    text: '',
  },
  yAxis: {
    tickAmount: 0,
    labels: {
      enabled: false,
    },
  },
  xAxis: {
    labels: {
      enabled: false,
    },
    tickLength: 0,
    min: 0.25,
    max: 2.75,
  },
  plotOptions: {
    "column": {
      dataLabels: {
        enabled: true,
        inside: false,
      },
    }
  },
  series: [
    {
      name: '',
        data: [122, 56.2, 87, 191],
    },
  ],
});

Highcharts.chart('container2', {
    chart: {
      type: 'column',
    },
    title: {
      text: '',
    },
    yAxis: {
      tickAmount: 0,
      labels: {
        enabled: false,
      },
    },
    xAxis: {
      labels: {
        enabled: false,
      },
      tickLength: 0,
            //min: 0.25,
            //max: 2.75,
    },
    plotOptions: {
      "column": {
        dataLabels: {
          enabled: true,
          inside: false,
        },
      }
    },
    series: [
      {
        name: '',
                data: [122, 56.2, 87, 191],
      },
    ],
});

Answer 1

我在 Highcharts 论坛中得到了答案：https://www.highcharts.com/forum/viewtopic.php?p=190834&sid=511556b33e8e9527fcc978743061a10d#p190834

当将 x 轴最小值和最大值设置为例如时，您是正确的。 0.25/2.75，y 轴极值不考虑外部值，因为它们位于 x 轴极值之外（外部左列和右列仍然布置在 0 和第 3 个刻度上）。

作为解决方法，您可以设置要在列内呈现的数据标签，或者在加载事件时将 y 轴最大值设置为略高于数据的最大值，为数据标签留出足够的空间渲染。