Highcharts標誌工具提示與標誌重疊。

Question

當標誌標題和標誌文本都長於特定長度時，工具提示開始與標誌本身重疊。因此，它很容易讓鼠標經過工具提示。因此，鼠標無法與圖表交互，因爲它位於工具提示上方，而不是直接位於圖表上方。只有鼠標移出工具提示區域時，鼠標纔會再次與圖表交互。

當有很多標誌時，與圖表交互變得非常困難。

嘗試將鼠標懸停在與長標題這裏的標誌： http://jsfiddle.net/msjaiswal/angnU/

下面是代碼：

$(function() { 
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=usdeur.json&callback=?', function(data) { 

    // Create the chart 
    $('#container').highcharts('StockChart', { 


     rangeSelector : { 
      selected : 1 
     }, 

     title : { 
      text : 'USD to EUR exchange rate' 
     }, 

     yAxis : { 
      title : { 
       text : 'Exchange rate' 
      } 
     }, 

     series : [{ 
      name : 'USD to EUR', 
      data : data, 
      id : 'dataseries', 
      tooltip : { 
       valueDecimals: 4 
      } 
     }, { 
      type : 'flags', 
      data : [{ 
       x : Date.UTC(2011, 1, 14), 
       title : 'A', 
       text : 'Shape: "squarepin"' 
      }, { 
       x : Date.UTC(2011, 3, 28), 
       title : 'Long tooltip title', 

       text : 'This is a really really really long tooltip text.' 
      }], 
      onSeries : 'dataseries', 
      shape : 'squarepin', 
     }, { 
      type : 'flags', 
      data : [{ 
       x : Date.UTC(2011, 2, 1), 
       title : 'B', 
       text : 'Shape: "circlepin"' 
      }, { 
       x : Date.UTC(2011, 3, 1), 
       title : 'B', 
       text : 'Shape: "circlepin"' 
      }], 
      shape : 'circlepin', 
      width : 16 
     }, { 
      type : 'flags', 
      data : [{ 
       x : Date.UTC(2011, 2, 10), 
       title : 'C', 
       text : 'Shape: "flag"' 
      }, { 
       x : Date.UTC(2011, 3, 11), 
       title : 'C', 
       text : 'Shape: "flag"' 
      }], 
      color : '#5F86B3', 
      fillColor : '#5F86B3', 
      onSeries : 'dataseries', 
      width : 16, 
      style : {// text style 
       color : 'white' 
      }, 
      states : { 
       hover : { 
        fillColor : '#395C84' // darker 
       } 
      } 
     }] 
    }); 
}); 

}）;

這是否有任何優雅的解決方法？

Answer 1

其實，我自己找到了一個解決方法。通過使工具提示跟隨鼠標，鼠標永遠不會超過工具提示。這不是一個完美的解決方案，而是一個好的解決方法。 使用選項：

tooltip: { 
     followPointer : true 
} 

演示： http://jsfiddle.net/msjaiswal/duxam/1/

Answer 2

您還可以使用工具提示定位http://api.highcharts.com/highstock#tooltip.positioner