Highcharts散点图。在绘图边缘附近点的悬停工作“悬停”

当散点放置在绘图边缘上时，只有当鼠标悬停在绘图区域中某点的一部分上时才会触发“悬停”事件。对于小标记，用户必须为工具提示“寻找像素”。下面是示例： http://jsfiddle.net/Efm4p/4/Highcharts散点图。在绘图边缘附近点的悬停工作“悬停”

$(function() { 
var chart; 

$(document).ready(function() { 
    chart = new Highcharts.Chart({ 
     chart: { 
      renderTo: 'container', 
      type: 'scatter', 
     }, 
     xAxis:{ 
      min:0, 
      max: 100}, 
     yAxis:{ 
      min:0, 
      max:2, 
      tickInterval:1, 
      lineWidth:1 
     }, 
     series: [{ 
      marker:{ 
       lineWidth:1, 
       lineColor:'BBBBBB', 
       radius:3 
      }, 
      data: [{x: 10, y: 2}, {x: 0.5, y:1}, {x: 0, y: 1}, {x: 12, y: 2}, {x: 11, y: 2}] 
     }] 
    }); 
}); 

});

在这个例子中很难得到一个工具提示点{X：0，Y：1}。

我想为轴设置minPadding/maxPadding，但是当我清晰地设置最小/最大值时，它们不起作用。显式设置最小/最大值很重要，因为实际图表显示x轴的％表格0到100和y轴的类别。一些点通过x轴具有0％或100％的值，并且通过y轴属于第一或最后一个类别。

更新：我的问题是“如何使'悬停'正常工作点，放置在剧情的边缘？

来源

2013-04-05 Alex Yelkin

好了，但如果是你的问题？你可以设置min：-5来在左侧留出一些空间，然后添加plotLine来突出显示xAxis上的0值。 – 2013-04-05 11:27:25

2PawełFus：我更新我的问题。 – 2013-04-05 11:56:06

这是分散系列的默认行为 - 仅在悬停标记时显示工具提示。您可以将系列类型更改为line，并设置lineWidth: 0。这应该会更好。

唯一的限制是，对于线/花键数据应该被排序由x值上升，并且对于相同的x值重复是不允许的。简单地将数据添加到您的数据将解决该问题。

(function() { 
    return [{x: 10, y: 2}, {x: 0.5, y:1}, {x: 0, y: 1}, {x: 12, y: 2}, {x: 21, y: 1}] 
      .sort(function(a,b){ return a.x - b.x }); 
})()

组合例：http://jsfiddle.net/Efm4p/5/

来源

2013-04-05 12:04:27

谢谢你的快速回答！排序使它好得多，但工具提示仍然只显示鼠标悬停点的右半部分（如果x == 0）。我不知道，在不改变min/max的情况下，鼠标移到左半部分时是否可以触发'悬停'，或者我应该开始探索并修改highcharts的源代码。对不起，我的英语不好！ – 2013-04-05 12:18:12

Highcharts散点图。在绘图边缘附近点的悬停工作“悬停”

回答

相关问题