Расположение силы d3: выделение узлов в группе и их соседей - PullRequest
Новая
       7

Расположение силы d3: выделение узлов в группе и их соседей

0 голосов
/ 26 сентября 2018

Я хотел бы выделить узлы и ребра, которые находятся в определенной группе.У меня есть функция connectedNodes, которая выделяет узел и его непосредственных соседей. 

          function connectedNodes() {

              if (toggle == 0) {

                  //Reduce the opacity of all but the neighbouring nodes
                  d = d3.select(this).node().__data__;
                  console.log(this)
                  console.log(d)
                  var sel_groups = new Array(d.pathway);

                  node.style("opacity", function (o) {
                      if (neighboring(d, o) | neighboring(o, d)) {
                        sel_groups.push(o.pathway)
                      }
                      return neighboring(d, o) | neighboring(o, d) ? 1 : 0.05;
                  });

                  sel_groups = sel_groups.filter((v, i, a) => a.indexOf(v) === i)

                  label.style("opacity", function (o) {
                      return neighboring(d, o) | neighboring(o, d) ? 1 : 0.05;
                  });

                  link.style("opacity", function (o) {
                      return d.index==o.source.index | d.index==o.target.index ? 1 : 0.05;
                  });

                  linkText.style("opacity", function (o) {
                      return d.index==o.source.index | d.index==o.target.index ? 1 : 0.05;
                  });

                  group.style("opacity", 0.05);
                  groupText.style("opacity", 0.05);

                  group.filter(function(d) { if (sel_groups.indexOf(d.id) != -1) { return true } }).style("opacity", 1);
                  groupText.filter(function(d) { if (sel_groups.indexOf(d.id) != -1) { return true } }).style("opacity", 1);

                  toggle = 1;
              } else {
                  //Put them back to opacity=1
                  node.style("opacity", 1);
                  label.style("opacity", 1);
                  link.style("opacity", 1);
                  linkText.style("opacity", 1);
                  group.style("opacity", 1);
                  groupText.style("opacity", 1);
                  toggle = 0;
              }

          }

Мне нравится иметь функцию, которая активируется, когда я щелкаю по группе и узлам (и ближайшим соседям и ссылкам) вгруппы выделены.Я пытался итеративно вызвать функцию connectedNode, но каким-то образом он не передает объект узла? 

          function highlightPathway(id) {

              if (toggle == 0) {
                  sel_nodes=graph.nodes.filter(function(d) { return d.pathway==id; })
                  sel_nodes.forEach(connectedNodes)
                  toggle = 1;
              } else {
                  //Put them back to opacity=1
                  node.style("opacity", 1);
                  label.style("opacity", 1);
                  link.style("opacity", 1);
                  linkText.style("opacity", 1);
                  group.style("opacity", 1);
                  groupText.style("opacity", 1);
                  toggle = 0;
              }

          }

1 Ответ

0 голосов
/ 26 сентября 2018

Да, путь является атрибутом узла, поэтому я понял, что это работает: 

              sel_circles=svg.selectAll("circle").filter(function(d){
                return d.pathway == id;
              })

Спасибо!

...