如何在高图表中删除条形悬停时的背景颜色答案

【问题标题】：How to remove background color on hover of bar in highcharts如何在高图表中删除条形悬停时的背景颜色
【发布时间】：2023-04-08 03:35:02
【问题描述】：

我正在使用highcharts。版本：9.1.1

我正在显示条形图。当我将鼠标悬停在bars 上时，它会显示background color，但我不想要那种背景颜色。

正如我们在下图中看到的那样，我不希望通过将鼠标悬停在 green bar 上来显示 grey 的颜色。

我应用了这个解决方案，但它也禁用了工具提示。但我需要悬停时的工具提示。

plotOptions: { 
       series: {
          enableMouseTracking: false
       }
}

谢谢

【问题讨论】：

【解决方案1】：

参考@Robart。我检查图表并修改类.highcharts-crosshair-category 样式

我申请了以下样式

.highcharts-crosshair-category {
   display: none !important;
   visibility: hidden !important;
 }

【讨论】：

使用 !important 不是一个好方法。在我的示例中，我使用了所有这些类来避免使用 !important。所以，在 .highcharts-crosshair-category 之前看一下，看看是否定义了其他类，并像我的示例一样使用它们。 stackoverflow.com/questions/27443589/…

【解决方案2】：

我会查看用于这些图表的类。

找到图表的类后，您可以在 .css 文件中修改它们。

<li class="class1">
                <a class="class2">
                    <span class="class3"></span>

假设您有类似的东西，但您的情况下的跨度将是图表。在这种情况下，在 .css 文件中，您必须执行以下操作：

.class1 .class2 .class3:hover {
    background: none; 
}

使用浏览器工具，您还可以模拟（强制）悬停并进行一些更改。

【讨论】：

【解决方案3】：

在chartOption中进行此更改：十字准线：false

【讨论】：