javascript - 使用 d3.layout.stack() 从图层访问自定义坐标

Question

我有以下形式的数据数组:

_data = [
    {key: <String>, values: [<number>...]}
]

如果每个 JSON 对象中的“values”变量是 JSON 坐标数组(即“x: ?, y: ?”)，我可以使用以下内容:

d3.layout.stack()
    .values(function(d) {
        return d.values;
    });

相反，我需要从每个层的值数组中读取 x 作为值数组中的索引，并将 y 作为数字。就像这样:

_data = [
    {key: "oranges", values: [5, 6, 8]},
    {key: "bananas", values: [2, 1, 9]}
]

becomes

"oranges": (0, 5), (1, 6), (2, 8);
"bananas": (0, 2), (1, 1), (2, 9);

如何做到这一点？

Answer 1

如果我正确理解您的问题，您正在寻找适当的访问器函数来从 D3 的堆栈布局中访问您的特定数据格式。以下代码应该可以满足您的要求:

d3.layout.stack()
    .values(function(d) {
        return d.values.map(function(y, i) {
            return { "x": i, "y": y };
        });
    });

对 .map() 的调用将转换您的 data.values 数组并返回一个由具有 x 和 的对象组成的数组>y 坐标设置为您指定的值。