dimple.js 中的自定义工具提示颜色和字体大小

Question

酒窝里有没有api可以自定义工具提示的颜色和字体type/size？我主要是在寻找一种方法来为折线图和条形图执行此操作。

如果这不可能，那么有没有 alternate/recommended 方法通过 d3 做到这一点？

我尝试在酒窝文档中寻找执行此操作的方法，但找不到任何东西

Answer 1

您可以使用 CSS class .dimple-custom-tooltip-box 进行自定义。不幸的是，dimple.js 在 class 之后的元素上内嵌了许多属性（如填充颜色），因此您需要使用 !important 来覆盖它们：

  .dimple-custom-tooltip-box {
     fill: red !important;
  }

这是一个 example。

编辑

折线图的工具提示中缺少 dimple-custom-tooltip-box。不知道为什么，the docs 表明它应该在那里。无论如何，将 css 切换为：

rect.dimple-tooltip {
  fill: red !important;
}

它适用于两种图表类型。

已更新 example。