Dcjs光标和工具提示

Question

我使用dc.js和d3-tip作为我的lineChart并获得了下一个：

现在只有当我在某行上mouseover时才会显示工具提示。我需要在图表的任何位置显示工具提示，并在每个轴附近显示精确值，如图below所示：

我可以用dc.js吗？

更新：

我找到了一些d3 solution但无法使用dc.js实现它。请帮帮我。

Answer 1

dc.js不会给你一个方法来做到这一点。但是你可以在图表上添加一个renderlet或postrender来添加一些简单的东西。我在使用d3-tip和dc.js时遇到了问题，而是使用了自定义解决方案。

将一个小提琴（基于another time-related question）与轴上的值标签放在一起。 https://jsfiddle.net/2bg6eyfq/2/（更新）

我已经添加了自定义xyTips（跟踪线），因为dc的xyTips仅适用于鼠标悬停点。 dc.js中一个棘手的问题是你无法显示数据点并设置xyTipsOn（false），这些点只是赢得了。

chart
  .xyTipsOn(false)
  .renderDataPoints({radius: 3}) // these points won't show up

所以，你打开xyTips（默认）然后你可能想删除或隐藏dc的xyTips，而不是我的小提琴，但这很容易。

你可能还想看看这个问题并回答戈登： how to highlight max and min points on lineChart