Question

我试图绘制堆积区域图

我已将问题提炼为this plunker。

示例数据如下，我已确认数据（通过堆栈布局重新计算）传递给区域生成器功能areaFcn。只是路径永远不会随数据更新。我不知道为什么。

任何？

谢谢！

var areaFcn = function(d, i) {
 d3.svg.area() 
 .x(function(d, i) { return xScaleT(d.t); }) 
 .y0(function(d) { return yScale(d.y0); }) 
 .y1(function(d) { return yScale(d.y0 + d.y); }); 
}

var inData = [ {"data":[
 {"svName":"BBC [890]","avgBW":9654498}, 
 {"svName":"CNN [453]","avgBW":4033202}, 
 {"svName":"ESPN [984]","avgBW":4715123}], 
 "timestamp":1430712151000}, 
 {"data":[ 
 {"svName":"BBC [890]","avgBW":9654498}, 
 {"svName":"CNN [453]","avgBW":4033202}, 
 {"svName":"ESPN [984]","avgBW":4715123}], 
 "timestamp":1430712153000}, 
 {"data":[ 
 {"svName":"BBC [890]","avgBW":4103549}, 
 {"svName":"CNN [453]","avgBW":4413707}, 
 {"svName":"ESPN [984]","avgBW":11648783}], 
 "timestamp":1430712156000} 
]

http://plnkr.co/edit/dVU7NRwVsxjiQLRRKnoS

Answer 1

该路径没有d属性。代码中的一些调试显示，函数areaFcn返回undefined。将其改为此，它将起作用：

var areaFcn = d3.svg.area()
.x(function(d, i) {
    return xScaleT(d.t); })
.y0(function(d) {
    return yScale(d.y0); })
.y1(function(d) {
    return yScale(d.y0 + d.y); });

路径未在d3堆积区域图中绘制

1 个答案: