更改窗口大小时，Highchart 图例重叠

Question

自动图例标题具有样式text-overflow: ellipsis;，但我需要显示图例标题中的所有文本。所以，我需要设置text-overflow: clip;。 当用户更改窗口大小时，图例项相互重叠或
移到图表容器之外。

你可以在这里复制它：https://jsfiddle.net/6ybv9kjx/6/ 为了重现，您应该在图表初始化时更改窗口大小。

另外，图例项目的显示也有一定的规律。如果图例项中的所有文本没有与前一项放在一行中，则项移动到下一行。我需要，那个传说项目可以打破文字。有可能吗？

Answer 1

useHtml 是已知的problem。

现在，如果您真的不需要它，只需禁用它。

Fiddle

Answer 2

您可以通过在调整浏览器窗口大小时重新绘制图表来解决此问题。这样，图例元素将根据窗口的新宽度呈现。

将您的图表选项分配给一个变量，然后您将在每次调整窗口大小时调用该变量。

var thisChartOptions = {
    /* your options go here */
};

/* draw chart when the browser window is loaded or resized 
   (see https://stackoverflow.com/a/1974797/2596103) */

$(window).on('resize', function() {
    Highcharts.chart('container', thisChartOptions);
}).resize();

你可以在这个小提琴中看到这个工作：https://jsfiddle.net/brightmatrix/6ybv9kjx/43/

我尝试使用legend.update() 函数（参见https://api.highcharts.com/class-reference/Highcharts.Legend#update），但是当窗口变小时，图例项会相互重叠。