Javascript D3js arcTween错误:r不是函数(更新失败)
我一直在尝试更新饼图,但当我尝试将其放大时,它完全失败了 这是我遇到问题的代码:Javascript D3js arcTween错误:r不是函数(更新失败),javascript,d3.js,Javascript,D3.js,我一直在尝试更新饼图,但当我尝试将其放大时,它完全失败了 这是我遇到问题的代码: var d2_data, d2_path, d2_pie, d2_text, d2_arc; function D2_Update() { d2_data = [d2_employed,d2_student,d2_unemployed,d2_retired]; d2_path.data(d2_pie(d2_data)) .transition().duration(1000) .attrT
var d2_data, d2_path, d2_pie, d2_text, d2_arc;
function D2_Update()
{
d2_data = [d2_employed,d2_student,d2_unemployed,d2_retired];
d2_path.data(d2_pie(d2_data))
.transition().duration(1000)
.attrTween("d", arcTween(null, d2_arc)); // Redraw the arcs
d2_text.data(d2_pie(d2_data))
.transition().duration(1000)
.attr("transform", function (d) {
return "translate(" + d2_arc.centroid(d) + ")";
})
.text(function(d){return d.data;});
}
function arcTween(a, arc) {
var i = d3.interpolate(this._current, a);
this._current = i(0);
return function(t) {
return arc(i(t));
};
}
当调用这个更新函数时,图表上的文本会正确地更新一次,然后它就无法像我上面链接的代码笔那样实际更改弧。我得到的回报是控制台错误读取TypeError:r不是来自我的D3js JavaScript文件的函数。我在这里完全困惑,因为我不确定我应该做什么不同
感谢您对我的问题的任何帮助。我还将显示此图形饼图的代码:
// D2 pie
d2_data = [d2_employed,d2_student,d2_unemployed,d2_retired];
var d2_dataKey = ["Employed","Student","Unemployed","Retired"];
var d2_width = 400,
d2_height = 400,
d2_radius = Math.min(d2_width, d2_height) / 2;
d2_arc = d3.svg.arc()
.outerRadius(d2_radius - 10)
.innerRadius(d2_radius - 85);
d2_pie = d3.layout.pie()
.sort(null)
.value(function(d) {
return d;
});
var d2_svg = d3.select("#general_d2-graph").append("svg")
.attr("width", d2_width)
.attr("height", d2_height)
.append("g")
.attr("id", "pieChart")
.attr("transform", "translate(" + d2_width / 2 + "," + d2_height / 2 + ")");
d2_path = d2_svg.selectAll("path")
.data(d2_pie(d2_data))
.enter()
.append("path");
d2_text = d2_svg.selectAll("text")
.data(d2_pie(d2_data))
.enter()
.append("text")
.attr("text-anchor", "middle")
.attr("transform", function (d) {
return "translate(" + d2_arc.centroid(d) + ")";
})
.text(function(d){return d.data;});
d2_path.transition()
.duration(1000)
.attr("fill", function(d, i) {
return color(d.data);
})
.attr("d", d2_arc)
.each(function(d) {
this._current = d;
}); // Store the initial angles
谢谢。我尝试将其放大,但完全失败了
;这是什么意思?你期望这行代码做什么呢?我想它应该调用函数并把值发送给它,但是我得说实话,我不太明白这个函数的来龙去脉。在任何情况下,即使我注释掉了这些添加内容,错误仍然存在,最终我不得不恢复到旧版本。目前,我正在重新进行实施工作。我想使用arcTween
功能在我的网页上更新多个饼图,但我完全迷失在正确的方向上。