使用Twitter的引導酥料餅與Highcharts

我試圖實現與HighchartsTwitter的引導酥料餅組件時，用戶將鼠標懸停在我的條形圖酒吧。我無法使用Highcharts原有的工具提示，因爲我希望我的用戶與彈出窗口中的內容進行交互，而您無法高效地使用Highcharts工具提示進行操作，例如點擊鏈接。使用Twitter的引導酥料餅與Highcharts

我遇到的問題是訪問單個的rect DOM元素以添加必要的屬性，如rel="popover"和data-content="foo"，這將使這項工作。

我有一個JSFiddle我在那裏爲懸停結束事件僞代碼。

我將不勝感激任何意見。

謝謝！

來源

2013-01-03 Allen Liu

你需要做兩件事情：

附加酥料餅圖表加載

確保酥料餅是不是裏面SVG

chart: { 
     renderTo: 'container', 
     type: 'bar', 
     events: { 
      load: function(e) { 
       $(".highcharts-tracker rect").popover({trigger:'hover', placement:'bottom', title:'Title!', content:'Content'}).hover(function() { 
        $('.popover').appendTo($(document.body)); 
       }); 
      } 
     } 
    },

追加如果你想讓它觸發點擊，然後將其更改爲：

    $(".highcharts-tracker rect").popover({trigger:'click', placement:'bottom', title:'Title!', content:'Content'}).click(function() { 
         $('.popover').appendTo($(document.body)); 
        });

您將不得不進一步修改此代碼以滿足您的需求，但這應該有助於您開始。

工作示例：JSfiddle

來源

2013-01-03 02:26:59

感謝Voitek！這絕對是正確的方向:)你知道如何使用這種方法訪問'series.point.marker'對象嗎？我對我的描述中沒有添加這一點表示歉意。 –

我不知道我明白。當你將鼠標懸停在別的東西上（而不是酒吧？）時，你想顯示彈出窗口嗎？如果您只想訪問事件中的series.points，那麼您可以通過訪問hover/click事件中的e.delegateTarget.series來完成此操作。 –

是的，我有興趣訪問該系列中的點數據。明天早上我會說這個。謝謝！ –

使用Twitter的引導酥料餅與Highcharts

回答

相關問題