d3js:`xlink:href`不起作用

d3js: `xlink:href` is not working

本文关键字：不起作用 href xlink d3js      更新时间：2023-09-26

我正在尝试实现href到d3js图表，如本文和此处所述。我在这个d3js条形图中添加了一个简单的href，但它不起作用。这是我的代码：
我在html:中导入了xlink

<myatr xmlns:xlink="http://www.w3.org/1999/xlink">
</myatr>

这是我的d3js代码

svg.selectAll(".bar")
      .data(data)
      .enter().append("rect")
      .attr("class", "bar")
      .attr("x", function(d) { return x(d.letter); })
      .attr("width", x.rangeBand())
      .attr("y", function(d) { return y(d.frequency); })
      .attr("height", function(d) { return height - y(d.frequency); })
      .attr("xlink:href",function(d){return "www.google.com";});

看起来您也需要附加a标记。试试这个：

svg.selectAll(".bar")
      .data(data)
    .enter().append("a")
      .attr("xlink:href", "www.google.com")
    .append("rect")
      .attr("class", "bar")
      .attr("x", function(d) { return x(d.letter); })
      .attr("width", x.rangeBand())
      .attr("y", function(d) { return y(d.frequency); })
      .attr("height", function(d) { return height - y(d.frequency); })
相关文章：