css - 谷歌图表中的工具提示样式

Question

我想知道是否可以更改 google 折线图中默认工具提示的字体颜色。

我想通过改变 css 样式来做到这一点:

<style>

    .google-visualization-tooltip { 

            width: 150px !important;
            border: none !important;
            border-radius: 21px !important;
            background-color: rgb(30, 50, 230)!important;
            position: absolute !important;
            box-shadow: 7px 7px 5px 0px rgba(50, 50, 50, 0.75) !important;
            background: -moz-linear-gradient(30deg, rgb(30, 50, 230) 30%, rgb(90, 140, 250) 70%) !important;
            background: -webkit-linear-gradient(30deg, rgb(30, 50, 230) 30%, rgb(90, 140, 250) 70%) !important;
            background: -o-linear-gradient(30deg, rgb(30, 50, 230) 30%, rgb(90, 140, 250) 70%) !important;
            background: -ms-linear-gradient(30deg, rgb(30, 50, 230) 30%, rgb(90, 140, 250) 70%) !important;
            background: linear-gradient(120deg, rgb(30, 50, 230) 30%, rgb(90, 140, 250) 70%) !important;
            font-size:  10px !important;

          }


    </style>

所有这些 css 行都运行良好，但直到现在我还没有找到字体颜色参数。

顺便说一下，如果我修改 Line Chart API 的“tooltip.textStyle”参数字体颜色改变，但上面提到的 CSS 代码变得不可用。

谢谢!

Answer 1

除了同一用户给出的答案之外...

你必须设置

tooltip: { isHtml: true }

在 CSS 工作的图表选项中。请阅读官方 Google Charts 文档:customizing tooltip content