我一直遇到一个错误,上面写着“未捕获的TypeError:无法使用d3.v3.js读取未定义的属性'map'。
这是我的圆环图代码:
function pieChart ( dataurl, selector ) {
var margin = {top: 20, right: 20, bottom: 20, left: 20};
width = 400 - margin.left - margin.right;
height = width - margin.top - margin.bottom;
var radius = Math.min(width, height) / 2;
var color = d3.scale.ordinal()
.range(["#3399FF", "#5DAEF8", "#86C3FA", "#ADD6FB", "#D6EBFD"]);
var arc = d3.svg.arc()
.outerRadius(radius)
.innerRadius(radius - 20);
var pie = d3.layout.pie()
.sort(null)
.startAngle(1.1*Math.PI)
.endAngle(3.1*Math.PI)
.value(function(d) {
return d.value;
});
var donut = d3.select("#portfolio")
.append('svg')
.attr("width", '100%')
.attr("height", '300px')
.attr('viewBox','0 0 '+Math.min(width,height) +' '+Math.min(width,height) )
.attr('preserveAspectRatio','xMinYMin')
.append("g")
.attr("transform", "translate(" + ((width/2)+margin.left) + "," + ((height/2)+margin.top) + ")");
d3.json("data/donut.json", function(error, json) {
json.forEach(function(kv){
kv.Data.forEach(function(d){
d.value = +d.value;
});
// // console.log(json);
// json.Data.value.forEach(function(d) {
// d.value = +d.value;
// console.log(d.value);
// });
var path = donut.selectAll(".arc")
.data(pie(kv.Data.value))
.enter().append("g")
.attr("class", "arc");
g.append("path")
.style("fill", function(d) { return color(d.Data.label); })
.transition().delay(function(d, i) { return i * 500; }).duration(500)
.attrTween('d', function(d) {
var i = d3.interpolate(d.startAngle+0.1, d.endAngle);
return function(t) {
d.endAngle = i(t);
return arc(d);
}
});
});
});
};
它不会显示圆环图并将错误标记到控制台中的d3.v3.js文件中。以下是它给我的错误:
d3.layout.pie = function() {
var value = Number, sort = d3_layout_pieSortByValue, startAngle = 0, endAngle = 2 * π;
function pie(data) {
var values = data.map(function(d, i) {
return +value.call(pie, d, i);
非常感谢任何帮助。