D3js: how to open new tab after doubleclick on element?

I found the window.open method works (in the oncick below).

vis.selectAll("text")
      .data(nodes)
    .enter().append("svg:text")
      .attr("class", function(d) { return d.children ? "parent" : "child"; })
      .attr("x", function(d) { return d.x; })
      .attr("y", function(d) { return d.y; })
      .attr("dy", ".35em")
      .attr("text-anchor", "middle")
      .style("opacity", function(d) { return d.r > 20 ? 1 : 0; })
      .text(function(d) { return d.name; })
      .on("click",function(d){
          window.open(d.url, '_blank')});

      d3.select(window).on("click", function() { zoom(root); });
});

First, opening a PAGE on doubleclick :

 function dblclick(a){
    window.location.assign("http://en.wikipedia.org/wiki/"+a.properties.name, '_blank');
 }

you then simply add .on("dblclick", dblclick); in your D3 element generation :

 svg.append("g")
    .attr("class", "L0" )
  .selectAll(".countries")
    .data(topojson.feature(world, world.objects.admin_0).features) 
  .enter().append("path")
    .attr("data-name-en", function(d) { return d.properties.name; })
    .style("fill", "#E0E0E0")
    .attr("d", path)
    .on("dblclick", dblclick);

and it will work (if no other element is upon your target).

Secondly, opening a NEW TAB is known as depending on the browser and user's preference. The '_blank' upper ask for a new tab/windows, but this depend on the browser default and custom preferences.

Tags:

D3.Js