我试图在我的D3圈子包装上放置标签,因为我使用的是circle-text插件。我希望像这个例子circle_pack circle_text那样做。 当我放大节点时,问题在于更新标签位置和它们的光线。
我的代码:
function zoom(d) {
var k = diameter / d.r / 2;
x.domain([d.x - d.r, d.x + d.r]);
y.domain([d.y - d.r, d.y + d.r]);
var focus0 = focus; focus = d;
var transition = d3.transition()
.duration(d3.event.altKey ? 7500 : 750)
.tween("zoom", function(d) {
var i = d3.interpolateZoom(view, [focus.x, focus.y, focus.r * 2 + margin]);
return function(t) { zoomTo(i(t)); };
});
circleText.radius(function (d) { return k * d.r- 5 ; });
transition.selectAll('g.label')
.attr('transform', function(d) {
return 'translate(' + x(d.x) + ',' + y(d.y) + ')';})
.call(circleText);
}
function zoomTo(v) {
var k = diameter / v[2]; view = v;
node.attr("transform", function(d) { return "translate(" + (d.x - v[0]) * k + "," + (d.y - v[1]) * k + ")"; });
node.attr("r", function(d) { return d.r * k;});
}