我得到了以下D3 v4饼图,每次尝试对其进行更新时,数据均无法正确更新。我一直在尝试以下其他示例,但似乎无法使其正常工作。当前的更新功能如下:
function PieGenUpdater(data, colourRangeIn) {
var dataset = data;
var width = 400;
var height = 400;
var radius = Math.min(width, height) / 2;
var arc = d3.arc()
.innerRadius(radius/1.5)
.outerRadius(radius);
var pie = d3.pie()
.value(function(d) { return d.percent; })
.sort(null);
var svg = d3.select('#c-pie');
var path = svg.selectAll('path').data(pie(dataset));
path.enter()
.append("path")
.attr('fill', function(d, i) {
return d.data.color;
})
.attr("d", arc)
.each(function(d) {this._current = d;} );
path.transition()
.attrTween("d", arcTweenCoverage);
path.exit().remove();
// Store the displayed angles in _current.
// Then, interpolate from _current to the new angles.
// During the transition, _current is updated in-place by d3.interpolate.
function arcTweenCoverage(a) {
var i = d3.interpolate(this._current, a);
this._current = i(0);
return function(t) {
return arc(i(t));
};
}
}
非常感谢您的帮助。
这是四年来太迟了...
在PieGenUpdater中更改
var path = svg.selectAll('path').data(pie(dataset));
to
var path = svg.select('g').selectAll('path').data(pie(dataset));
在您的更新函数中,您是在元素而不是元素的正下方添加了来自数据集1的其他路径