動態數據標籤Highcharts CSS

Question

我有一個Highcharts餅圖，其中添加了一個表格和兩個按鈕。我需要來自圖表的數據標籤以動態方式出現在他們周圍，而不是隱藏在他們當前的下方。

有沒有辦法避免與Highcharts中的數據標籤重疊的表發生衝突？

有沒有辦法做到這一點CSS或自定義JavaScript需要？

fiddle

Answer 1

我注意到您設置table到z-index: 1。

你的Highchart是一個SVG，所以它沒有z-index的概念。 SVG中的排序類型是畫家模型，意味着每個後續元素都被繪製在另一個元素上。

如果你真的想要一個佔據與圖表相同空間的表格，我想不幸你必須將表格作爲SVG中的元素放在highcharts-data-labels之前，以便這些標籤浮在表格上，因爲它們會被「繪製在桌子的上面」。