How can I make double click event on node in d3.js?
I want to make double click event on nodes. So I tried
.on("dbclick",function(d){return "http://google.com");});
and
.bind({"dbclick",function(d){alert("hello")} });
But all failed. Can anyone help me?
Full codes are below.
var node = svg.selectAll(".node")
.data(graph.nodes)
.enter().append("g")
.attr("class", "node")
//.on("dbclick",function(d){return "http://google.com");});
//.attr("xlink:href", function(d){return d.url;}
.call(force.drag);
//.bind({"dbclick",function(d){alert("hello")} });
Finally, I used a below method. (dblclick also works)
var node = svg.selectAll(".node") .data(graph.nodes) .enter().append("a")
.attr("class", "node") .attr("target", "_blank")
.attr("xlink:href", function(d){return "google.com";;})
You can use "dblclick" instead of "dbclick":
nodes.on("dblclick",function(d){ alert("node was double clicked"); });
If using D3 Observable:
const nodeEnter = node.enter().append("g")
.on("dblclick", d => {
d3.event.preventDefault();
// do your thing
});