javascript - 在 D3s x 轴刻度标签上添加工具提示

Question

我正在使用 d3.svg.axis() 函数来绘制条形图的 x 轴。由于轴上的标签可能很长，因此我需要剪切它们(比方说四个字母)并将其余部分显示为工具提示。我想使用 svg:title ，因为浏览器将负责显示工具提示。知道我该如何实现这一目标吗？如何在 x 轴刻度上的每个标签上添加标题元素？

非常感谢!

Answer 1

应该简单如下:

// tooltip
d3.selectAll('.x.axis>.tick') // gs for all ticks
  .append('title') // append title with text
  .text(function(d){
    return d;
});

示例 here .