d3.js,单击以链接到使用变量编码的另一个URL

Question

我制作了一个散点图,并希望为每个点添加一个链接.

    chart.selectAll("scatter-dots")
      .data(data)
      .enter().append("circle")
        .attr("cx", function (d) { return x(d.position[0]); } )
        .attr("cy", function (d) { return y(d.position[1]); } )
        .attr("r", 4)
        .style("fill", "#666")
        .style("opacity", 0.5)
    .on("click", function(){
        var url = "http://somelink.com/link.php?id=";
        url += d.link_id;
        //$(location).attr('href', url);
        //window.location = url;    
    });

如果我只是放置纯String链接,例如window.location ="http://stackoverflow.com",它就可以工作.但是,如果我从变量向URL的末尾添加查询,则页面不会重定向.

jquery和javascript都没有工作(如评论.)

我也试过一个外部的js文件,但仍然失败了.

这是一个PHP文件,如果这有帮助.

Answer 1

如果它使用静态字符串,则d.link_id出现问题.尝试通过做alert(d.link_id)或者使用萤火虫或类似物来看看里面的东西console.log(d.link_id).

或者,您应该使用真正的锚点来链接节点而不是设置点击事件.这会像......

chart.selectAll("scatter-dots")
  .data(data)
  .enter()
  .append("a")
    .attr("xlink:href", function(d) {return "http://somelink.com/link.php?id=" + d.link_id})
    .append("circle")
      .attr("cx", function (d) { return x(d.position[0]); } )
      .attr("cy", function (d) { return y(d.position[1]); } )
      .attr("r", 4)
      .style("fill", "#666")
      .style("opacity", 0.5)

(我似乎无法回想起这是否是这样做的确切方法,您可能需要将锚点保存在变量中,然后将圆圈附加到它们.)