饼状图显示未捕获类型错误:不能调用方法'map'的定义

nvd3 pie chart says Uncaught TypeError: Cannot call method 'map' of undefined

本文关键字:方法 调用 定义 不能 map 显示 错误 类型      更新时间:2023-09-26

这是活塞- http://plnkr.co/edit/pXitfqb8K2IbxOHXw0uL?p=preview

记录正确的值,但不构建饼状图。
相反,我可以在日志

中看到以下内容
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

如何解决这个问题?

看一下nv.d3.js中的9623行,您会发现map方法是在数组的第一个元素上调用的,并且您的数据是一个对象。

你需要做的是把你的值封装在一个只有1个元素的数组中:

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}] 
}];

我为此挣扎了一段时间,主要是因为我是从nvd3.org网站上的实时示例开始的。

事实证明,现场站点示例中的数据格式与核心nvd3下载中捆绑的示例中的数据格式不同。

在下载的pie.html示例中,数据指定如下:

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

当传递数据时,它被包装在一个未命名的/键数组中…

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

经过几个小时的努力,我终于解决了这个问题。

请查看http://plnkr.co/edit/qJnZzBS4ZOUtD2q9FV11?p=preview查看它是如何工作的