当我绘制带有多个系列的折线图时，对于给定的数据点，具有最高y值的系列每次都会触发onclick事件。其他每个系列有时会触发它，有时则不会。我似乎找不到任何模式。如果我隐藏了一个序列，则新的最高y值将开始起作用，即使以前没有。
我当前正在使用highcharts v6.0.1，但我也在最新版本中重新创建了该问题。它也发生在Chrome，Firefox和IE上。
我在这里发现了一个线程，该线程关于单击事件在显示多个序列时不触发，但是具体来说是关于两个序列具有相同的值，以便数据点彼此堆叠。
我创建了一个jsfiddle来演示该问题。 https://jsfiddle.net/2opdhxb6/1/。
Highcharts.chart('container', {
"chart":{
"height":400,
"type":"areaspline"
},
"colors":[
"#86bbd8",
"#5e2e94",
"#c83258",
"#ffb400",
"#7bcdba",
"#ff8300",
"#4464ad",
"#e1cba4",
"#ff9bb8",
"#808285",
"#da3ab3",
"#6ecdb2",
"#e2cc00",
"#d8635d",
"#3b5cad",
"#9778d3",
"#00bfd6",
"#5b2c3f",
"#4c8b2b",
"#d9a460"
],
"credits":{
"enabled":false
},
"legend":{
"borderWidth":"0",
"symbolRadius":3
},
"plotOptions":{
"series":{
"cursor":"pointer",
"fillOpacity":0,
"lineWidth":2,
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"point":{
"events":{
"click":function () {
alert('Category: ' + this.category + ', value: ' + this.y);
}
}
},
"turboThreshold":50000
},
"spline":{
"lineWidth":2,
"marker":{
"enabled":true,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"turboThreshold":50000
}
},
"series":[
{
"data":[
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Blog",
"Type":"SubMedia",
"Value":"BL",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":0
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Blog",
"Type":"SubMedia",
"Value":"BL",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":1182
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Blog",
"Type":"SubMedia",
"Value":"BL",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":1034
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Blog",
"Type":"SubMedia",
"Value":"BL",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":2164
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Blog",
"Type":"SubMedia",
"Value":"BL",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":1870
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Blog",
"Type":"SubMedia",
"Value":"BL",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":1324
}
],
"name":"Blog"
},
{
"data":[
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Forum",
"Type":"SubMedia",
"Value":"FO",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":0
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Forum",
"Type":"SubMedia",
"Value":"FO",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":225
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Forum",
"Type":"SubMedia",
"Value":"FO",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":239
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Forum",
"Type":"SubMedia",
"Value":"FO",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":299
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Forum",
"Type":"SubMedia",
"Value":"FO",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":332
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Forum",
"Type":"SubMedia",
"Value":"FO",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":181
}
],
"name":"Forum"
},
{
"data":[
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Online News",
"Type":"SubMedia",
"Value":"NM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":0
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Online News",
"Type":"SubMedia",
"Value":"NM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":4789
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Online News",
"Type":"SubMedia",
"Value":"NM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":8495
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Online News",
"Type":"SubMedia",
"Value":"NM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":10207
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Online News",
"Type":"SubMedia",
"Value":"NM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":5324
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Online News",
"Type":"SubMedia",
"Value":"NM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":3383
}
],
"name":"Online News"
},
{
"data":[
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Print Media",
"Type":"SubMedia",
"Value":"PR",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":0
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Print Media",
"Type":"SubMedia",
"Value":"PR",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":542
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Print Media",
"Type":"SubMedia",
"Value":"PR",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":390
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Print Media",
"Type":"SubMedia",
"Value":"PR",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":729
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Print Media",
"Type":"SubMedia",
"Value":"PR",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":713
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Print Media",
"Type":"SubMedia",
"Value":"PR",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":390
}
],
"name":"Print Media"
},
{
"data":[
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Social Media",
"Type":"SubMedia",
"Value":"SM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":0
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Social Media",
"Type":"SubMedia",
"Value":"SM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":113
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Social Media",
"Type":"SubMedia",
"Value":"SM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":94
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Social Media",
"Type":"SubMedia",
"Value":"SM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":79
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Social Media",
"Type":"SubMedia",
"Value":"SM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":99
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Social Media",
"Type":"SubMedia",
"Value":"SM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":33
}
],
"name":"Social Media"
},
{
"data":[
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Radio",
"Type":"SubMedia",
"Value":"TM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":0
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Radio",
"Type":"SubMedia",
"Value":"TM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":323
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Radio",
"Type":"SubMedia",
"Value":"TM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":228
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Radio",
"Type":"SubMedia",
"Value":"TM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":359
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Radio",
"Type":"SubMedia",
"Value":"TM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":319
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"Radio",
"Type":"SubMedia",
"Value":"TM",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":180
}
],
"name":"Radio"
},
{
"data":[
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"TV",
"Type":"SubMedia",
"Value":"TV",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":0
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"TV",
"Type":"SubMedia",
"Value":"TV",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":13247
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"TV",
"Type":"SubMedia",
"Value":"TV",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":14163
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"TV",
"Type":"SubMedia",
"Value":"TV",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":12370
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"TV",
"Type":"SubMedia",
"Value":"TV",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":14956
},
{
"Date":null,
"Medium":null,
"MediumName":null,
"SearchName":null,
"SearchTerm":"TV",
"Type":"SubMedia",
"Value":"TV",
"marker":{
"enabled":false,
"lineWidth":1,
"radius":3,
"symbol":"circle"
},
"name":null,
"y":6382
}
],
"name":"TV"
}
],
"subtitle":{
"style":{
"color":"#c4c4c4",
"fontFamily":"Avenir",
"fontSize":"12px",
"fontWeight":null,
"minWidth":null,
"textAlign":null,
"width":null
},
"text":"(By Medium)"
},
"title":{
"style":{
"color":null,
"fontFamily":"Avenir",
"fontSize":"20px",
"fontWeight":"bold",
"minWidth":null,
"textAlign":null,
"width":null
},
"text":"Hits"
},
"tooltip":{
"valueSuffix":""
},
"xAxis":{
"categories":[
"4\/12\/2019",
"4\/13\/2019",
"4\/14\/2019",
"4\/15\/2019",
"4\/16\/2019",
"4\/17\/2019"
],
"dateTimeLabelFormats":null,
"gridLineColor":null,
"gridLineDashStyle":null,
"gridLineWidth":null,
"labels":{
"enabled":true,
"formatter":null,
"rotation":0,
"staggerLines":0,
"style":{
"color":null,
"fontFamily":"Avenir",
"fontSize":null,
"fontWeight":null,
"minWidth":null,
"textAlign":null,
"width":null
},
"useHTML":false
},
"minorGridLineWidth":null,
"minorTickInterval":null,
"plotBands":null,
"tickInterval":0,
"tickWidth":2,
"tickmarkPlacement":"off",
"title":null,
"type":null
},
"yAxis":[
{
"allowDecimals":true,
"minRange":0.1,
"title":{
"margin":10,
"rotation":270,
"style":{
"color":null,
"fontFamily":"Avenir",
"fontSize":null,
"fontWeight":null,
"minWidth":null,
"textAlign":null,
"width":null
},
"text":null
}
}
]
});
它使用的是我在应用程序中呈现的实际JSON，因为当我尝试示例数据时，无法重新创建问题。我认为我必须配置错误，但是我不知道它可能是什么。
在该示例中，您可以看到电视连续剧的所有数据点都触发了该事件，但没有其他动作。如果您隐藏电视连续剧，除Blog以外的所有其他电视连续剧都将开始工作。任何帮助弄清楚这一点将不胜感激。
答案 0 :(得分：0)
您已将图表类型设置为等于areaspline。这就是为什么主上方下方的系列点隐藏在其下方的原因（请在此演示文稿上进行检查：https://jsfiddle.net/BlackLabel/w3q0y1uo/）。要使其按预期工作，只需将图表类型更改为spline。
代码：
"chart":{
"height":400,
"type":"spline"
}
演示：