Array/Object JSON data.map 不是函数 D3.js v3答案

【问题标题】：Array/Object JSON data.map is not a function D3.js v3Array/Object JSON data.map 不是函数 D3.js v3
【发布时间】：2019-07-14 13:20:54
【问题描述】：

我有一个动态 JSON 数据，它更改 API 可能返回单个对象或数据数组，当 API 返回单个对象时，我在循环和数据映射上收到错误。但是我尝试不对数据应用 forEach 并单独获取数据并将它们存储为数据。我收到 data.map is not a function 的错误。我有一个条形图，我想在下面显示数据。

 "City": {
    "Town": "Texas",
    "Number": "12"
  }

下面的代码显示了指向 forEach 和 data.map 的数据。如果代码返回多个数据，则代码正确显示。

  data.forEach((d) => {
       d.town = d.Town;
       d.number = +d.Number;
  }); 

  const xScale = d3.scale.ordinal()
            .domain(data.map(d => d.town))
            .rangeRoundBands([0, width], 0.1);

  const yScale = d3.scale.linear()
            .domain([0, d3.max(data, d => d.number)])
            .range([height, 0]);

无论 API 返回单个还是多个值或数据，我如何才能处理图表中的动态数据？

【问题讨论】：

在尝试使用.map()之前，您可以使用Array.isArray()来测试值
@Pointy 在检查了 Array.isArray() 之后，我可以用什么来代替 .map() ？
如果不是数组，那么它只是一个对象，可以直接访问data.town。

标签： javascript jquery arrays object d3.js

【解决方案1】：

对象，{}，在 JavaScript 中没有方法 .map()，它只适用于数组，[]。

因此，为了让您的代码正常工作，请将 data.map() 更改为 data.city.map()，因为 City 是一个可以迭代的数组。

【讨论】：

如果数据只包含 { "Town": "Texas", "Number": "12" }
可以直接退货； var data = {"Town":"Texas", "Number":"12"}; document.getElementById("demo").innerHTML = data["Town"];