Question

我使用D3js与Mongodb和AnguarlJS来显示我的数据。一切都很好，直到我给我的JSON数组命名。然后角度开始抱怨东西，我不知道为什么。

这是与原始代码一起使用的原始json数组

[

  {
    "defaultCategory":"Happy",
    "timesUsed":2704659
  },
  {
    "defaultCategory":"Sad",
    "timesUsed":4499890
  },
  {
    "defaultCategory":"Laughter",
    "timesUsed":2159981
  },
  {
    "defaultCategory":"Smirk",
    "timesUsed":3853788
  },
  {
    "defaultCategory":"Flirty",
    "timesUsed":14106543
  }
]


d3.json("data.json", function(error, data) {
        data.forEach(function(d) {
           d.timesUsed =+ d.timesUsed;
    });

但是当我将json更改为此格式时，它会中断

{
  "mymood":[

  {
    "defaultCategory":"Happy",
    "timesUsed":2704659
  },
  {
    "defaultCategory":"Sad",
    "timesUsed":4499890
  },
  {
    "defaultCategory":"Laughter",
    "timesUsed":2159981
  },
  {
    "defaultCategory":"Smirk",
    "timesUsed":3853788
  },
  {
    "defaultCategory":"Flirty",
    "timesUsed":14106543
  }
]

}


 d3.json("data.json", function(error, data) {
        data.mymood.forEach(function(d) {
           d.timesUsed =+ d.timesUsed;
    });

在chrome控制台中，错误发生在data.mymood.foreach行，但我不明白为什么因为它正好返回相同的json，好像没有像这样的名字

[对象，对象，对象，对象，对象]

并且函数中的参数d也返回数组中的同一个对象

修改的

错误：

未捕获的TypeError：undefined不是函数

console.log（data） - ＆gt;对象{mymood：Array [5]}

console.log（data.mymood） - ＆gt; [对象，对象，对象，对象，对象]

为那些对完整代码感兴趣的人

https://gist.github.com/gwong89/e3a29b64d94ad20256bb

Answer 1

就像奥斯卡指出的那样，forEach循环工作正常。但是，在仔细观察您的要点之后，如果您尝试使用mymood键，请确保您还更改了您使用的第55行

var g = svg.selectAll('g')
            .data(pie(data))

到

var g = svg.selectAll('g')
            .data(pie(data.mymood))

也在第76行

var total = d3.sum(data.map(function(d) {

到

var total = d3.sum(data.mymood.map(function(d) {

我抓住你的项目仓库并在我的本地环境中尝试了这些，我可以渲染饼图和弹出窗口而不会看到任何错误。

Answer 2

您的代码似乎工作正常（来自我测试过的）。我建议尝试调试您的代码，或者如果您觉得更舒服，请尝试尽可能多地console.log(...)，并从头开始检查您的浏览器控制台 （我没什么可说的）。尝试使用 Chrome 中的开发者工具，这是一个更好的选择。

我尝试使用 d3.js 库复制您的上下文，并使用数据上传 json 文件到我的 Dropbox 只是为了能够执行 ajax 请求，一切都很好（新的JSON结构也有效）。这就是我所做的，可能可以帮助你学习新的东西（见下文）。

解决问题的可能提示/建议：

根据问题标题，似乎data.mymood为undefined，因此您无法对不存在的某些内容进行forEach。尝试验证并避免使用空指针（参见示例）。

JSON 结构有效，因此不是问题。

语法似乎从我测试的内容中有效。

检查库之间是否存在冲突，尝试对使用所需的所有库进行一些研究（不确定这是否是您的情况，但可能发生）。

检查浏览器控制台并执行一些调试，如第一段所述。

检查您的请求是否未超时或发生其他情况，查看网络标签或使用开发者工具在浏览器控制台中记录您的请求来自 Chrome （只是说）。

现场演示： http://jsfiddle.net/29f6n8L7/

d3.json('https://dl.dropboxusercontent.com/u/15208254/stackoverflow/data.json', function(data) {

    // Some ways to avoid null pointers
    var obj = (data || {}), // If 'data' is null, initialize as an Object
        moods = (obj.mymood || []),  // If 'obj.mymood' is null, initialize as an Array
        time = 0, 
        mood;

    // Same way to get 'mymood' from the object
    console.log('Your obj.mymood contains: %o', obj.mymood);
    console.log('Your obj["mymood"] contains: %o', obj['mymood']);

    /**
     * I will suggest to use a traditional loop instead of 'forEach'.
     * Please read: http://stackoverflow.com/a/9329476/1178686
     * for a better explanation    
     */
    for (var i = 0; i < moods.length; ++i) {
        mood = moods[i];
        if (mood) {
            time += mood.timesUsed;
        }
    }

    // Output
    console.log('Sum of timesUsed is: %s', time);
});

Answer 3

对于es5中的每个数组都有内置数组，对象则没有。

未捕获的TypeError：当使用带名称的JSON对象时，undefined不是函数

3 个答案: