2014-02-06 45 views
0

我需要突出顯示nvd3圖表上的整個堆棧欄,以顯示整個欄的值的常見工具提示。nvd3:如何突出鼠標懸停整個堆積酒吧?

我的代碼是相同的例子:http://nvd3.org/ghpages/multiBar.html

+0

在NVD3中沒有這個選項,所以你必須修改源代碼。 –

+0

已經克隆了多欄圖表模型,可以通過'multibar.dispatch.on('elementMouseover.tooltip')'事件手動高亮顯示?或者不得不修改'multibar'組件? – byterussian

+0

我不確定修改的細節,但這不是一個簡單的更改 - 您必須選擇並突出顯示其中一個條的鼠標懸停上的其他條以及更改工具條中顯示的內容。 –

回答

0

爲亮點,把你的CSS是這樣的:

.nv-bar:hover { 
    fill: #ff0000 //this is bright red, pick the highlight color you want 
} 

工具提示將可能是最好的JavaScript或jQuery的實現。使用他們的事件系統彈出在鼠標懸停上顯示元素,將其移動到鼠標並用適當的數據填充它。在mouseleave上隱藏它。

+0

我不知道爲什麼格式不能用於我的代碼... –

+0

,因爲默認情況下,當圖表呈現時,樣式是內聯的,它會覆蓋任何CSS樣式。在你的CSS中,你需要將它定義爲填充:#ff0000!對於樣式的生效很重要 – user3658423

相關問題