添加D3中的节点的链接



因此,我正在处理D3 Visual中的一个问题,其中我正在尝试创建具有可单击的链接的节点。我只是在学习D3,所以我很难创建这些链接。现在到目前为止,我已经在所有节点上都有链接,但是我想实现的基本上是为每个节点具有不同的链接。目前,我只是为每个节点放置一个URL,但是如何选择一个单个节点并将链接附加到它。我想拥有它,所以当用户单击对象节点时,它将转到另一个页面。

var onode = svg.append('g').selectAll(".outer_node")
        .data(data.outer)
      .enter().append("g")
        .attr("class", "outer_node")
        .on("mouseover", mouseover)
        .on("mouseout", mouseout)
        .on("click", click);
function click (d){
    window.open("https://www.google.com", "_self");
    }

这使得每个节点都具有相同的确切链接,我不知道如何分配不同的链接。有人可以帮忙吗?

假设您存储在数据集中的URL,则可以访问函数中的URL:

function click (d){
    let url = "http://" + d.url; //or whatever your URL field is called in the data
    window.open(url, "_self");
}

您提到"数组中的位置",因此,如果URL在单独的数组中,但与数据集保持一致,则可以使用

function click (d, i){ //is this 0 based index of each item in the selection
    let url = urlData[i]
    window.open(url, "_self");
 }

最新更新