【问题标题】:d3: Optionally add child elements based on node content in force layoutd3:在强制布局中根据节点内容可选地添加子元素
【发布时间】:2012-10-08 18:57:56
【问题描述】:

使用 d3 中的强制布局,我可以愉快地添加节点,例如,一个圆形的 SVG 组和一些文本:

var node = vis.selectAll(".node")
    .data(nodes)
    .enter().append("svg:g")
    .attr("class", "node");
node.append("svg:circle")
    .attr("r", 5);
node.append("svg:text")
    .text(function(d) { return d.nodetext });

但是,我想可选地向组中添加另一个元素,具体取决于节点数据:因此,如果此节点的数据包含“图像”属性,我想添加一个新的子元素(一个 svg:image)。将 svg:image 添加到所有节点很容易(我只是按照上面的圆圈和文本进行操作)。动态更改您已经创建的元素的属性也很容易(根据上面的text,将函数作为属性的值)。我不知道如何添加svg:image 子元素仅当数据包含image 属性。实现这一目标的最佳方法是什么?

【问题讨论】:

    标签: javascript d3.js force-layout


    【解决方案1】:

    试试selection.filter:

    node.filter(function(d) { return d.image; }).append("image")
        .attr("xlink:href", function(d) { return d.image; })
        .attr("width", 16)
        .attr("height", 16);
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2014-10-24
      • 2012-03-01
      • 1970-01-01
      • 2015-06-20
      • 2014-11-20
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多