在Nvd3.js中使用图像作为标签

Question

我想使用图像代替文本标签来绘制带有Nvd3的discreteBarChart。可能吗 ？如果是这样，怎么样？

Answer 1

我认为这是不可能的，但您可以使用d3直接放置图像，例如：

d3.select("#chart1 svg").append("svg:image")
        .attr("xlink:href", "img/20.png")
        .attr("width", 70)
        .attr("height", 105)
        .attr("x", 160)
        .attr("y",100);

Answer 2

它不是API的一部分，但你可以破解它。

例如，要用图像替换x标签，请执行以下操作：

d3.selectAll('#yourChartId svg .nv-x.nv-axis.nvd3-svg g g g.tick')
  .select('text')
  .remove();

d3.selectAll('#yourChartId svg .nv-x.nv-axis.nvd3-svg g g g.tick')
  .append('svg:image')
  .attr('xlink:href', 'images/myimage.png')
  .attr('width', 40)
  .attr('height', 40);