javascript - nvd3 pie chart says Uncaught TypeError: Cannot call method 'map' of undefined - Stack Overflow

admin管理员组

文章数量:1292119

Here is the plunker -

Is it logging right values, but not building pie chart.
Instead, I can see the following in logs

nvd pie -  {"values":[{"parent":"Food","amount":116.1},{"parent":"Home","amount":670.14},{"parent":"Travel","amount":365.24},{"parent":"Taxes","amount":31.240000000000002},{"parent":"Entertainment","amount":13.24}]} script.js:166
Uncaught TypeError: Cannot call method 'map' of undefined nv.d3.js:9623

How can I fix this issue?

Here is the plunker - http://plnkr.co/edit/pXitfqb8K2IbxOHXw0uL?p=preview

Is it logging right values, but not building pie chart.
Instead, I can see the following in logs

nvd pie -  {"values":[{"parent":"Food","amount":116.1},{"parent":"Home","amount":670.14},{"parent":"Travel","amount":365.24},{"parent":"Taxes","amount":31.240000000000002},{"parent":"Entertainment","amount":13.24}]} script.js:166
Uncaught TypeError: Cannot call method 'map' of undefined nv.d3.js:9623

How can I fix this issue?

• javascript
• d3.js
• nvd3.js

Share Improve this question Follow asked Jun 17, 2013 at 21:57 daydreamerdaydreamer 92.1k204204 gold badges472472 silver badges750750 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

Having a look at line 9623 from nv.d3.js, you will find that the map method is called on the first element of an array and your data is an object.

What you need to do, is to encapsulate your values inside of a 1 element array:

var data = [{ 
  key : "",
  values : [{"parent":"Food","amount":116.1},{"parent":"Home","amount":670.14},{"parent":"Travel","amount":365.24},{"parent":"Taxes","amount":31.240000000000002},{"parent":"Entertainment","amount":13.24}] 
}];

I struggled with this for a while, mainly because I started from the live examples on the nvd3 site.

It turns out the data format in the examples on the live site differs to that in the examples bundled with the core nvd3 download.

In the pie.html example in the download the data is specified as follows:

var testdata = [
{ 
  key: "One",
  y: 5
},
{ 
  key: "Two",
  y: 2
},
{ 
  key: "Three",
  y: 9
}
];

Then when passing the data through it's wrapped in an unnamed/keyed array ...

d3...datum([testdata])....

This format works fine for me.

After struggling through many hours, I was able to fix this issue.

Please look at http://plnkr.co/edit/qJnZzBS4ZOUtD2q9FV11?p=preview to see how it works

本文标签： javascriptnvd3 pie chart says Uncaught TypeError Cannot call method 39map39 of undefinedStack Overflow