多个系列的水平十字线

问题描述

当我为yAxis启用十字准线时，似乎只有最后一个系列定义了十字准线。我希望所有这些都是十字绣。

（如果他们也有颜色（或者最好是较暗的变体）作为系列，我会很喜欢。）

解决方案

您可以为每个系列创建一个y轴，将这些附加轴链接到第一个轴，并在每个轴中定义一个特定的十字准线 - 然后将系列链接到特定轴，您将获得每个系列的单独定制十字准线。

  Highcharts.chart（'container' ，{
 yAxis：[{
 gridLineWidth：0，
 crosshair：{
 width：2，
 color：Highcharts.getOptions（）。colors [0] 
} 
}，{
 linkedTo：0，
十字线：{
 width：2，
 color：Highcharts.getOptions（）。colors [1] 
}，
 visible：false 
}]，
 
工具提示：{
 shared：true 
}，
 
系列：[{
 data：data.slice（）
}，{
 yAxis：1，
 data：data.reverse（）
}] 
}）; 
  

例如：

It seems like when I enable crosshair for the yAxis, only the last series defined get a crosshair. I would like all of them to be crosshaired.

(.. and I would love if they also had the color (or preferably a darker variant) as the series.)

解决方案

You can create an y axis per series, link those additional axes to the first one and define a specific crosshair in each axis - then link series with a specific axis and you will get an seperate customizable crosshair per series.

Highcharts.chart('container', {
    yAxis: [{
      gridLineWidth: 0,
      crosshair: {
        width: 2,
        color: Highcharts.getOptions().colors[0]
      }
    }, {
      linkedTo: 0,
      crosshair: {
        width: 2,
        color: Highcharts.getOptions().colors[1]
      },
      visible: false
    }],

    tooltip: {
      shared: true
    },

    series: [{
        data: data.slice()
    }, {
      yAxis: 1,
      data: data.reverse()
    }]
});

example: http://jsfiddle.net/absuLu6h/

这篇关于多个系列的水平十字线的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！