Как найти событие клика в forceDirectedGraph на графике Angular-nvd3 - PullRequest
Новая
       29

Как найти событие клика в forceDirectedGraph на графике Angular-nvd3

0 голосов
/ 11 октября 2019

Я работаю с Angular-nvd3 forceDirectedGraph для отображения данных.

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

Я провел некоторое исследование на сайте angular-nvd3, но не смог найти событие щелчка, которое обычно происходит, как показано нижекод: 

dispatch: {  
                elementMouseover: (t, u)=>{


                },
                elementMouseout: (t, u)=>{


                },
                elementClick: (t, u) =>{

                }
            }

И я должен связать данные в угловой области 6, или я могу вызвать функцию, чтобы связать их.

Пожалуйста, найдите приведенный ниже код, над которым я работал, и предложите мнеправильный путь.

Plunkr

1 Ответ

0 голосов
/ 20 октября 2019

Это можно сделать с помощью функции nodeExtras. Когда вы расширяете его в вашем Plunkr, как показано ниже, «нанизанный» объект узла отображается в предупреждении, когда на нем происходит щелчок мышью. Он также изменяет курсор (на курсор в виде руки), когда указатель мыши находится над узлом. 

nodeExtras: function(node) {
      node 
      .attr('cursor', 'pointer')
      .on('click', n => alert(JSON.stringify(n)))
      && node
      .append("text")
      .attr("dx", 10)
      .attr("dy", ".55em")
      .text(function(d) { return d.name;})
      .style('font-size', '10px');
},

Вместо 'click' вы, скорее всего, предпочтете выбрать 'dblclick', в противном случае предупреждение отображается каждый раз. время, когда пользователь перетаскивает узел.

...