2015-03-05 5 views
2

У меня есть простой график сети, где я хочу использовать ctrl-Click, чтобы разрешить навигацию по внешнему URL-адресу. Смотрите JS скрипку здесь:d3js Force Network: узел Ctrl-Click для внешней ссылки?

https://jsfiddle.net/NovasTaylor/o1qesn6k/

Я успешно жестко ссылку для всех узлов, использующих d3.event.ctrlKey под на мыши события, как:

var nodes = svg.selectAll("g.node") 
       .data(dataset.nodes) 
       .enter() 
       .append("g") 
       .attr("class", "node") 
       .on("dblclick", dblclick) 
       .on("click", function() { 
        if (d3.event.ctrlKey) { 
        location.href = 'http://www.google.com'; 
        } 
        }) 
       .call(drag); 

вместо этого я хочу использовать URL-адрес, указанный для каждого узла в исходных данных, как d.url (см. Fiddle - значение доступно для узла «B»).

Я видел некоторые ссылки на кодировку этого тега, но не смог получить событие клика, чтобы активировать навигацию по URL-адресу. Целевой URL должен открываться в том же окне, заменяя граф силовой сети.

Ваша помощь будет принята с благодарностью.

Приветствия,

Tim

UPDATE: С советами Ларса код, который решает проблему является::

var nodes = svg.selectAll("g.node") 
     .data(dataset.nodes) 
     .enter() 
     .append("g") 
     .attr("class", "node") 
     .on("dblclick", dblclick) 
     .on("click", function (d) { 
     if (d3.event.ctrlKey) { 
      location.href = d.url; 
     } 
    }) 
+1

Установите 'location.href = d.url', где' d' является первым аргументом для обратного вызова. –

ответ

2

Практически все функции обратного вызова в D3 приведены данные, привязанные к элементу в качестве аргумента. Вы можете ссылаться на это в определении функции и устанавливать значения динамически. В вашем случае это будет

Смежные вопросы