我开始使用 D3 并尝试使用 example使用我自己的 JSON。代码显示 Uncaught TypeError: a.map is not a function，但 JSON 已经被解析，所以我不知道是什么。
这是我的代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Step 1 - A Basic Pie Chart</title>
</head>
<body>
<div id="chart"></div>
<script type=text/javascript src="{{url_for('static', filename='d3.min.js') }}"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
(function(d3) {
'use strict';
var width = 360;
var height = 360;
var radius = Math.min(width, height) / 2;
var color = d3.scale.category20b();
var svg = d3.select('#chart')
.append('svg')
.attr('width', width)
.attr('height', height)
.append('g')
.attr('transform', 'translate(' + (width / 2) +
',' + (height / 2) + ')');
var arc = d3.svg.arc()
.outerRadius(radius);
var pie = d3.layout.pie()
.value(function(d) { return d.Value; })
.sort(null);
d3.json('https://demo-url.com/api/v1.0/tables/56afce8f243c48393e5b665a'
, function(error, dataset){
if (error) throw error;
var path = svg.selectAll('path')
.data(pie(dataset))
.enter()
.append('path')
.attr('d', arc)
.attr('fill', function(d, i) {
return color(d.data.Name);
});
});
})(window.d3);
</script>
</body>
</html>
这是页面 JSON 返回的内容:
curl -i -X GET https://demo-url.com/api/v1.0/tables/56afce8f243c48393e5b665a
HTTP/1.1 200 OK
content-type: application/json
content-length: 702
server: Werkzeug/0.11.3 Python/2.7.6
date: Wed, 03 Feb 2016 02:56:32 GMT
X-BACKEND: apps-proxy
{"data": [{"_id": {"$oid": "56afcea3243c48393e5b665f"}, "idDatasource": {"$oid": "56afce8f243c48393e5b665a"}, "Id": 5, "Value": 0, "Name": "Brock"}, {"_id": {"$oid": "56afcea3243c48393e5b665d"}, "idDatasource": {"$oid": "56afce8f243c48393e5b665a"}, "Id": 3, "Value": 0, "Name": "Peter"}, {"_id": {"$oid": "56afcea3243c48393e5b665e"}, "idDatasource": {"$oid": "56afce8f243c48393e5b665a"}, "Id": 4, "Value": 0, "Name": "John"}, {"_id": {"$oid": "56afcea3243c48393e5b665b"}, "idDatasource": {"$oid": "56afce8f243c48393e5b665a"}, "Id": 1, "Value": 0, "Name": "Ash"}, {"_id": {"$oid": "56afcea3243c48393e5b665c"}, "idDatasource": {"$oid": "56afce8f243c48393e5b665a"}, "Id": 2, "Value": 0, "Name": "Sarah"}]}
最佳答案
那是因为 pie 函数需要一个数组作为它的参数，你传递的是一个对象 dataset。
尝试传递dataset.data，这是一个数组
var path = svg.selectAll('path')
.data(pie(dataset.data))
.enter()
.append('path')
.attr('d', arc)
.attr('fill', function(d, i) {
return color(d.data.Name);
});
关于javascript - d3.min.js Uncaught TypeError : a. 映射不是函数，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35167737/