D3/JS 映射 JSON 数据回调

Question

我见过很多d3.csv()回调映射的例子，比如：

var data = raw_data.map(function(d) { return 
    variable1 : +d.variable1,
    variable2 : +d.variable2
});

但是，我试图弄清楚如何使用 map.() 进行 JSON 回调。原因是我有一个属性 d: expected number, "MaNn", "NaNz" 错误。如果我没记错的话，这个错误通常与被解析为字符串的数据有关。 JSON 看起来是数字/浮点数，但以防 D3 将我的数据解析为字符串，我想将其映射为数字，以便我可以从控制台日志错误中排除解析为字符串的罪魁祸首。所以，我尝试的与上面的 csv 情况大致相同，使用一元 +:

var json = raw_json.map(function(d)  { return
    xs: +d.xs,
    ys: +d.ys,
    id: +d.id
});

此时，错误仍然存​​在。但是我不确定我是否完全拒绝了字符串解析错误的零假设，因为我并不完全确信我的 JSON 数据 .map() 的语法是正确的。我现在有点迷茫。

问题：我的.map() 完全错了吗？我还能做些什么来解决预期的数字错误吗？

我意识到 JSON 文件具有广泛的数据结构。这是我的console.log(raw_json) 在控制台日志中的屏幕截图：

Answer 1

您的 .map() 与您的 JSON 数据不匹配。您的 JSON 由 一个数组 组成，其中 一个对象 包含 三个数组，分别是 id、xs 和 ys。要将所有这些字符串转换为数值，您需要三个单独的循环：

var obj = raw_json[0];
obj.id = obj.id.map(id => +id);
obj.xs = obj.xs.map(x => +x);
obj.ys = obj.ys.map(y => +y);

或者，最好是，因为您不需要创建新数组而只转换为数字，您也可以使用.forEach() 而不是.map() 在现场进行转换。

const toNum = (d, i, a) => { a[i] = +d };   // Conversion function

var obj = raw_json[0];
obj.id.forEach(toNum);
obj.xs.forEach(toNum);
obj.ys.forEach(toNum);

查看以下工作示例：

var raw = `
  [{
    "id": ["1", "2", "3"],
    "xs": ["11", "12", "13"],
    "ys": ["21", "22", "23"]
  }]
`;
var data = JSON.parse(raw);

const toNum = (d, i, a) => { a[i] = +d };   // Conversion function

var obj = data[0];
obj.id.forEach(toNum);
obj.xs.forEach(toNum);
obj.ys.forEach(toNum);

console.dir(data);