将D3 JS版本5的坐标缩放到像素

Question

我正在一个项目中使用D3JS可视化地图中的位置。

我正在使用d3.geoMercator（）将位置转换为像素。

这是我的代码：

var projection = d3.geoMercator()
    .scale(2600)
    .center([-1.16455 , 47.15237]) // Pan north 40 degrees
    .translate([width/2,height/2]);

然后是位置图：

node = svg.selectAll("circle")
                .data(this.myData)
                .enter()
                .append("circle")
                .attr("class", "dot")
                .attr("r", 10)
                .attr("fill", this.col)
                .attr("transform", function(d) {
                  return "translate(" + projection([d.x,d.y]) + ")";});

位置正确显示，但是当我尝试在地图上进行某些缩放时，该位置的行为不正确，因此它们处于正确的位置。

每次用户缩放时，我都需要进行位置动态转换。

这是我用来缩放的代码：

var zoom = d3.zoom()
    .on("zoom", function() {
        this.node.attr("transform", d3.event.transform);
    });

svg.call(zoom);