放大d3.js V4布局时如何保持圆圈，笔触和字体大小？

Question

我正在使用d3.v4.js绘制布局。而且在放大时，我需要将圆圈，笔触和字体大小限制为最大值。

这是一个实现我想要的示例，但它在d3.v3.js中。

http://bl.ocks.org/eyaler/10586116

我不知道如何在d3.v4.js中实现它。有谁能够帮助我？谢谢。

Answer 1

我能想到的一种方法是在缩放时在节点上应用“反比例”。

缩放时，会将scale转换应用于<g>节点的直接子节点svg包装节点。

让MAX_SCALE为要在节点上应用的最大比例。 让currentScale应用于当前缩放比例。

如果（currentScale> MAX_SCALE），则在节点上应用“反比例”（让我们承认它们被标有“极限比例”类）：

d3.selectAll(".limit-scale").attr("transform", "scale(" + (MAX_SCALE/currentScale) + ")");

可以将相同的逻辑应用于stroke和font-size样式。