1

我有一个使用强制布局布局的图表。基本上我想为图中循环中包含的区域着色。这是我的代码。

当力布局稳定时，我试图绘制循环。

force.on("tick",function(){
    // ... I update the position of nodes and the links

    if(force.alpha() < 0.006){
        force.stop();

        // I dont know if there's an easier way of doing this

        var xnodes = [];
        force.nodes().forEach(function(d){ 
        xnodes.push([d.x, d.y]);
        }); 

        // I tried creating a path and filling with with green
        vis.select("path.area")
            .data([xnodes])
            .enter().append("path")
            .style("fill", "#00ff00")
            .attr("class", "area")
            .attr("svg:d", d3.svg.area());
    }
});

当我在 chrome 中运行它时，调试器显示它确实创建了一个路径，但路径的区域是 0px x 0px。我真的很困惑。我什至尝试手动设置数组。我犯了同样的错误。

    var ynodes = [[352.3554660996234,304.3361316660001],[449.88953454311286,313.14153937680953],
[392.0458559272036,389.6656922220398],[352.3554660996234,304.3361316660001]];
    vis.select("path.area")
        .data([ynodes])
        .enter().append("path")
        .style("fill", "#00ff00")
        .attr("class", "area")
        .attr("svg:d", d3.svg.area());

但是，当我将此代码放在一个空白的 html 文件中（在包含必要的库之后）时，它可以正常工作。它确实绘制了一条路径并用绿色填充它。我在这里真的很困惑。任何帮助将非常感激。谢谢。

4

0 回答 0