Question

尝试在v5中构建Streamgraph，但这与v3完全不同。

有意义：

.x(function(d) { return formatDate.parse(d.Year);})
.y(function(d) { return +d["HIV/AIDS"] });

但是我想这是已经过时的d3 v3代码。而是使用密钥。

console.log（“新嵌套数据：”，newData）;给出层：未定义

我在做什么错？

Codepen

数据：

key: "Zambia"
values: Array(14)
0: {Country: "Zambia", Year: "Year 2000",  HIV/AIDS: 3042, …}
1: {Country: "Zambia", Year: "Year 2001",  HIV/AIDS: 3170, …}
2: {Country: "Zambia", Year: "Year 2002",  HIV/AIDS: 3159, …}

代码：

//Stack generator
var stack = d3.stack()
.keys(function(d){return +d["HIV/AIDS"]})
.order(d3.stackOrderNone)
.offset(d3.stackOffsetNone)

//Line generator 
let area= d3.area()
    .x(function(d) {
        return xScale(dateFormat(d.Year));
    })
    .y0(function(d){
        return yScale(d.y0);

    })
    .y1(function(d){
        return yScale(d.y0 + d.y)
    })
//group data by country name
    let newData = d3.nest()
        .key(function(d) {
            return d.Country;
        })
        .sortKeys(d3.descending)
        .sortValues(function(a, b) {
            return dateFormat(a.Year) - dateFormat(b.Year);
        })
        .entries(data);

var layers = stack(newData);
    console.log("layers", layers); 
//Define yScale domain after data loaded
yScale.domain([d3.max(data, function(d) {
    return +d["HIV/AIDS"]
}), 0]);


svg.selectAll("path")
    .data(layers)
    .enter()
    .append("path")
    .classed("line", true)
    .attr("d", function(d){
        return area(+d["HIV/AIDS"])
    })
    .style("fill", "url(#linear-gradient)")

d3.stack（）TypeError：无法读取未定义的属性“”

0 个答案: