【问题标题】:Is there a way to combine d3 json variables?有没有办法组合 d3 json 变量?
【发布时间】:2014-04-22 01:11:45
【问题描述】:

我有以下代码:

    var node = svg.selectAll(".node")
          .data(graph.nodes)
          .enter()
          .append("circle")
          .attr("class", "node")
          .attr("r", 20)
          .style("fill", function(d) { return color(d.group); })
          .call(force.drag)
          .style("visibility", function(d) {
            return d.group == 1 ? "hidden" : "visible";
          })
          .on("mouseover", function(d) {
            if(d.group == 2) {
              node.filter(function(d) { return d.group == 1; }).style("visibility", "visible");
              link.filter(function(d) { return d.value == 2; }).style("visibility", "visible");
            }
          }).on("mouseout", function(d) {
            if(d.group == 2) {
              node.filter(function(d) { return d.group == 1; }).style("visibility", "hidden");
              link.filter(function(d) { return d.value == 2; }).style("visibility", "hidden");
          }
        });

var texts = svg.selectAll("text.label")
                .data(graph.nodes)
                .enter().append("text")
                .attr("class", "label")
                .attr("fill", "black")
                .text(function(d) {  return d.name;  });

我想结合两个变量节点和文本来将鼠标悬停效果移动到组合中。这可能吗?如果是这样,怎么做?谢谢!

【问题讨论】:

  • 把重复的东西放到一个函数中,多次调用函数...
  • 我需要一个例子。我对此比较陌生
  • 我自己想通了。不过还是谢谢~!

标签: javascript json d3.js


【解决方案1】:

我相信您可以与filter 联系。即,

var node = svg.selectAll(".node").filter("text.label")

【讨论】:

  • 我要删除 text 变量和添加到 force.on 底部的文本吗?
  • 恐怕我不清楚你想要完成什么,所以我真的不能说。
【解决方案2】:
.on("mouseover", function(d) {
            if(d.group == 2) {
               changeVisibility("visible")
            }
          }).on("mouseout", function(d) {
            if(d.group == 2) {
              changeVisibility("hidden")
          }


function changeVisisbility(visibility){
      node.filter(function(d) { return d.group == 1; }).style("visibility", visibility);
      link.filter(function(d) { return d.value == 2; }).style("visibility", visibility);
}

【讨论】:

  • 这些与节点和链接有关。他们不链接到文本
猜你喜欢
  • 2022-01-12
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2016-03-03
  • 1970-01-01
  • 2017-02-12
  • 2021-09-30
相关资源
最近更新 更多