在D3 Streamgraph中正確使用stack.values（[accessor]）？

Question

我試圖用D3 API reference和this question at Stack Overflow中演示的值訪問器爲每層創建D3流圖表。

標題追加罰款，但它似乎並沒有附加值。任何想法可能會出錯？

我是新來的d3，所以我確定它很簡單。代碼如下。

var layers = [ 
    { 
    "name": "apples", 
    "values": [ 
     { "x": 0, "y": 91}, 
     { "x": 1, "y": 290} 
    ] 
    }, 
    { 
    "name": "oranges", 
    "values": [ 
     { "x": 0, "y": 9}, 
     { "x": 1, "y": 49} 
    ] 
    } 
]; 

var  m = 2; // number of samples per layer 
var width = 960, 
    height = 500, 
    mx = m - 1, 
    my = 350; 

var stack = d3.layout.stack() 
    .offset("wiggle") 
    .values(function(d) { return d.values; }); 

var area = d3.svg.area() 
    .x(function(d) { 
     return d.x * width/mx; 
    }) 
    .y0(function(d) { 
     return height - d.y0 * height/my; 
    }) 
    .y1(function(d) { 
     return height - (d.y + d.y0) * height/my; 
    }); 

var vis = d3.select("#chart") 
    .append("svg") 
    .attr("width", width) 
    .attr("height", height); 

vis.selectAll("path") 
    .data(stack(layers)) 
    .enter().append("path") 
    .attr("d", area) 
    .append("title") 
    .text(function(d) { return d.name; }); 

Answer 1

堆棧佈局知道你所指定的值訪問，但該地區發電機沒有。所以，你必須通過d.values而非d該地區發生，就像這樣：

.attr("d", function(d) { return area(d.values); })