如何更改圖表js工具提示的z-index？

我有4個圖表並排使用引導程序的網格系統。其中一個圖表的寬度只有一個柱寬（col-md-1），它使用氣泡圖（只顯示從上到下的圓圈）。但是，當我將鼠標懸停在泡泡上時，工具提示會被截斷。我試圖改變放置圖表元素的div的z-index，但是這並沒有解決問題。如何更改圖表js工具提示的z-index？

這是怎麼顯示出來的鼠標：

請讓我知道我可以改變提示元素的z-index的。

更新：我創建了一個小提琴是否有幫助： jsfiddle

代碼：

<div class="container-fluid"> 
     <div class="row"> 
      <div class="col-md-5 col-sm-5 col-xs-5"> 
       col 5 
      </div> 
      <div class="col-md-1 col-sm-1 col-xs-1"> 
       <div style="height: 60vh;"> 
        <canvas id="can" /> 
       </div> 
      </div> 
      <div class="col-md-6 col-sm-6 col-xs-6"> 
       col 6 
      </div> 
     </div> 
    </div>

來源

2017-07-14 Deepak

我們可以看到您的工具提示的CSS代碼？你把它放在你的標記中？ – Belder

工具提示還沒有css。我還沒有創造它。但我無法弄清楚目標元素或其類，以便我可以修改它。 – Deepak

css不用於造型chart.js工具提示，請參閱下面的答案 –

CSS不用於chart.js之造型工具提示，所以你不能更改z-索引。

我建議你閱讀http://www.chartjs.org/docs/latest/configuration/tooltip.html

造型的工具提示的文檔解決你的問題，你將不得不增加容器的大小與圖表的畫布。在你的小提琴中，這意味着增加div class="col-md-1 col-sm-1 col-xs-1"的寬度。

來源

2017-07-18 20:59:48

如何更改圖表js工具提示的z-index？

回答

相關問題