javascript - 未选取 D3 数组对象格式

Question

我试图让 D3 理解对象内的数组，以便 D3 识别出要创建两个元素，一个代表 10，一个代表 6。

如果我有一个标准数组，例如var myobj = [10,6];D3 理解这一点并创建了两个元素。但是，如果数组嵌入到如下所示的对象内，D3 将不会执行此操作。我的问题是 a) 为什么 D3 不明白这一点？ b) 如何让 d3 明白我想要创建两个元素？我看过 d3.nested() 但我不明白它。

感谢您的帮助

var myobj = 
    [
        {myarray:[10,6]}

    ];

  xx.selectAll(".newrec")
                .data(myobj)
                .enter()
                .append("rect")
                    .attr("class","newrec")
                    .attr("width",function (d) {return d.myarray;  }) //for width D3 returns one element rectangle with width of "10,6" which is not a width!
                    ;

Answer 1

如果您不想更改数据结构，您可以执行以下操作:

var myobj = [ {myarray:[10,6,7]} ];

d3.selectAll(".newrec")
    .data(myobj[0].myarray)
    .enter()
    .append("rect")
    .attr("class","newrec")
    .attr("width",function (d) {console.log(d); return d});

这将创建 3 个具有适当宽度的矩形，例如:http://jsfiddle.net/henbox/f3vqp7ct/