Chart.js在初始化時設置活動段

Question

我正在使用chart.js v2，我試圖在圖表加載時模擬環形圖上段的懸停狀態，以便突出顯示某個部分。

我一直在尋找和梳理一天的代碼，並找不到一個好的方法來做到這一點。

在此先感謝！

Answer 1

設置段的懸停樣式有點令人困惑，因爲它沒有真正記錄在任何地方。不過，當我想在傳奇標籤懸停的時候突出顯示一個細分市場的時候，我能夠找出它。

要做到這一點，您需要使用餅圖.updateHoverStyle()原型方法並傳入您想要突出顯示的段。圖表段存儲在數組中的_meta對象中，其中每個段索引與圖表數據數組中的每個值的位置相匹配。

下面是一個例子（假設您的圖表實例存儲在一個變種稱爲myPie。

// get the segment we want to highlight 
var activeSegment = myPie.data.datasets[0]._meta[0].data[segmentIndexToHihlight]; 

// update the hover style 
myPie.updateHoverStyle([activeSegment], null, true); 

// render so we can see it 
myPie.render(); 

你只需要定義要突出顯示並存儲在一個VAR什麼段稱爲segmentIndexToHihlight，它應該工作。

這裏是一個codepen example展示這一點。請注意，我故意沒有突出的負載段（我等待3秒），這樣就可以看到變化的發生。