javascript - Highcharts 图例项目未正确显示（直到调整窗口大小）

Question

我有一个图例项目相互重叠的图表（这是 itemDistance 选项设置为 20 的图像 - 显然项目之间的距离小于 20px，似乎 20px 是图例符号之间的项目距离）：

图表是固定的，只有在调整窗口大小后才能正确显示图例（完全相同的配置对象的图像 - 唯一的窗口已调整大小）：

我无法弄清楚我做错了什么，或者我是否刚刚在 Highcharts 中遇到了错误。我正在使用 Highcharts v. 7.2.0 和 HighchartsReactOfficial 库 v. 2.2.2。我的配置对象：

const options: Highcharts.Options = {
  chart: {
    type: 'spline',
    spacingLeft: 40,
    spacingRight: 40,
  },
  title: {
    style: {
      display: 'none',
    },
  },
  subtitle: {
    style: {
      display: 'none',
    },
  },
  credits: {
    enabled: false,
  },
  legend: {
    itemDistance: 20,
    itemStyle: {
      color: '#7990A1',
    },
  },
  plotOptions: {
    series: {
      marker: {
        symbol: 'circle',
        lineWidth: 1,
      },
      shadow: true,
    },
  },
  series: [{
      name: 'test1',
      type: 'spline',
      color: '#576A7B',
      data: [23, 3, 33, 54, 29, 38],
    },
    {
      name: 'test2',
      type: 'spline',
      color: '#FE7B1A',
      data: [45, 21, 76, 43, 67, 59],
    },
    {
      name: 'test3',
      type: 'spline',
      color: '#00BAFF',
      data: [7, 19, 5, 9, 12, 11],
    },
    {
      name: 'test4',
      type: 'spline',
      color: '#000000',
      data: [40, 3, 71, 20, 28, 31],
    },
  ],
  yAxis: {
    title: {
      style: {
        display: 'none',
      },
    },
    showFirstLabel: false,
  },
  xAxis: {
    categories: ['2019-05-15', '2019-05-16', '2019-05-17', '2019-05-18', '2019-05-19', '2019-05-20'],
  },
};

由渲染组件使用：

<HighchartsReact highcharts={Highcharts} options={options} />

帮助将不胜感激。