Javascript 放大/缩小时在地图上保持D3对象大小不变

我遵循的例子是

放大时，示例中绘制的卷轴会增大。我想不出一种方法可以使圆圈的大小保持不变

有什么想法吗

Edit1：关于如何保持饼图圆弧半径恒定的任何想法。我已经找到了使圆保持恒定半径的方法，如下所示：

            g1.append("circle")
                .attr("cx", 200)
                .attr("cy", 200)
                .attr("r", 10)
                .style("fill", "red");

        var zoom = d3.behavior.zoom().on("zoom", function () {

                g1.selectAll("circle")
                    .attr("transform", "translate(" + d3.event.translate.join(",") + ")scale(" + d3.event.scale + ")")
                    .attr("r", function(d) {
                        return 10/d3.event.scale;
                    });
            });

类似地，我有扇形图的圆弧，我希望在缩放时保持其大小：

                    var r = 4;
                    var p = Math.PI * 2;

                    var arc = d3.svg.arc()
                        .innerRadius(r - 2)
                        .outerRadius(r - 1)
                        .startAngle(0)
                        .endAngle(p * d.value1);
                    var arc2 = d3.svg.arc()
                        .innerRadius(r - 3)
                        .outerRadius(r - 2)
                        .startAngle(0)
                        .endAngle(p * d.value2);

                   var projection = d3.geo.mercator()
                        .center([0, 5])
                        .scale(200)

                    var translate = "translate(" + projection([77, 13])[0] + ", " + projection([77, 13])[1] + ")";
                    g.append("path")
                        .attr("d", arc)
                        .attr("fill", "maroon")
                        .attr("transform", translate);
                    g.append("path")
                        .attr("d", arc2)
                        .attr("fill", "green")
                        .attr("transform", translate);

---

关于如何保持弧型路径以保持相同大小的建议？

您必须在缩放事件处理程序中添加一些附加处理。将圆的半径设置为其标称值（5）除以缩放因子（

zoom.scale（）

）。这样，当应用缩放比例时，结果将是恒定的外观大小。比如：

var zoom = d3.behavior.zoom()
    .on("zoom",function() {
        g.attr("transform","translate("+ 
            d3.event.translate.join(",")+")scale("+d3.event.scale+")");
        g.selectAll("circle")
            .attr("d", path.projection(projection))
            .attr("r", 5/zoom.scale());
        g.selectAll("path")  
            .attr("d", path.projection(projection)); 
    });

---

@斯蒂芬，谢谢你的回复。“实际上，我已经想出了你建议的方法。@stephan，现在我的问题不局限于圆，而是饼图的圆弧。”。请参见我问题的编辑部分。缩放投影，而不是SVG。这将使SVG上的其他内容保持不变。有关示例，请参见。