Javascript Highcharts图例项未正确显示(直到调整窗口大小)

Javascript Highcharts图例项未正确显示(直到调整窗口大小),javascript,highcharts,react-highcharts,Javascript,Highcharts,React Highcharts,我有一张图表,其中图例项目相互重叠(这是itemDistance选项设置为20的图像-显然项目之间的距离小于20px,似乎20px是图例符号之间的项目距离): 图表是固定的,只有在调整窗口大小后才能正确显示图例(完全相同配置对象的图像-唯一的窗口已调整大小): 我不知道我做错了什么,或者我刚刚在Highcharts中遇到了一个bug。我用的是Highcharts v。7.2.0与HighCharts公司官方图书馆v。2.2.2. 我的配置对象: const options: Highchar

我有一张图表,其中图例项目相互重叠(这是itemDistance选项设置为20的图像-显然项目之间的距离小于20px,似乎20px是图例符号之间的项目距离):

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

我不知道我做错了什么,或者我刚刚在Highcharts中遇到了一个bug。我用的是Highcharts v。7.2.0与HighCharts公司官方图书馆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} />


非常感谢您的帮助。

您能提供小提琴来重现这个问题吗?您好@Furman,我已经测试了您的选项,似乎一切都正常: