Question

使用以下图表作为示例。

https://jsfiddle.net/albertwang/rqekhf9s/1/

  legend: {
    symbolHeight: 20,
    ......

我想更改这两个图例符号的高度。但是，我只能使用legend.symbolHeight来更改第一个。

谢谢您的帮助。

Answer 1

您不能更改样条曲线系列的图例大小，因为highcharts在图例中使用与该系列相同的样条线符号。您可以更改宽度，线条会变长，但高度无效。如果高度也被更改，则图例将不再与该系列相同。想象一下，如果您有2个系列，并且两个系列都带有圆形符号，则其中一个大于另一个。在图例中区分这两者的唯一方法是符号的大小。

没有设置可以实现所需的设置，唯一的选择就是包装绘制图例符号的功能。

如何在高级图表中包装函数： https://www.highcharts.com/docs/extending-highcharts/extending-highcharts

绘制图例符号的功能： https://github.com/highcharts/highcharts/blob/master/js/parts/Legend.js#L1277

如果要执行此操作，请注意可以将此函数包装为不同的系列类型或全部。

Answer 2

要实现所需的结果，可以使用一种简单的解决方法。使用所需的标记和spline属性创建其他空的id系列。接下来，在基本的linkedTo系列中使用spline：

series: [{
    name: 'Rainfall',
    type: 'column',
    yAxis: 1,
    data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
    tooltip: {
        valueSuffix: ' mm'
    }

}, {
    type: 'spline',
    linkedTo: 'fakeSeries',
    data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6],
    tooltip: {
        valueSuffix: '°C'
    }
}, {
    type: 'spline',
    marker: {
        radius: 10,
        symbol: 'circle'
    },
    color: 'black',
    name: 'Temperature',
    id: 'fakeSeries'
}]

实时演示：https://jsfiddle.net/BlackLabel/8cmurd3q/

API：

https://api.highcharts.com/highcharts/series.spline.linkedTo

https://api.highcharts.com/highcharts/series.spline.marker.symbol

在Highchart中，如何更改多轴图表中所有图例符号的高度？

2 个答案: