如何更改图表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？

回答

相关问题