找到你要的答案

Q:path not drawn in d3 stacked area chart

Q:路径不是画在D3堆叠面积图

I'm trying to plot a stacked area chart

I've distilled the problem down to this plunker.

Sample data is below and I've confirmed that the data (recalculated by the stack layout) is passed to areaFcn, the area generator function. Just that the paths are never updated with the data. I have no idea why.

Anyone?

Thanks!

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

我试图绘制一个叠加面积图

我摘录的问题到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

answer1: 回答1:

The path has no d attribute. Some debugging in the code shows, that the function areaFcn returns undefined. Change it to this and it'll work:

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); });

该路径没有d属性。一些调试代码中显示的功能,areafcn返回未定义。改变它,这将工作:

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.js