d3 SVG翻譯和縮放一組，但僅翻譯另一組

Question

我正在使用d3構建活動圖。 我先顯示一張世界地圖，然后再顯示一些代表活動的點。 地圖應同時可縮放和縮放。

我現在用來轉換的函數看起來像這樣：

function move() {

    var t = d3.event.translate;
    var s = d3.event.scale;
    var h = height / 4;


    t[ 0 ] = Math.min(
        ( width / height ) * ( s - 1 ),
        Math.max( width * ( 1 - s ), t[ 0 ] )
    );

    t[ 1 ] = Math.min(
        h * ( s - 1 ) + h * s,
        Math.max( height * ( 1 - s ) - h * s, t[ 1 ] )
    );

    zoom.translate( t );
    ctrl.g.attr( 'transform', 'translate(' + t + ')scale(' + s + ')' );
    ctrl.points.attr( 'transform', 'translate(' + t + ')' );

    //adjust the country hover stroke width based on zoom level
    d3.selectAll( '.country' ).style( 'stroke-width', 1.5 / s );

}

這會導致點移動，而不是根據緯度和經度保持其位置。 任何幫助，將不勝感激。

編輯：我忘了提到點應該保持其比例，也就是說，即使我放大了世界地圖，點也不能縮放，只能移動。

Answer 1

我找到了解決方案，

我忘了按比例縮小積分：/

我加了

d3.selectAll( '.point' ).attr('r', 5/s);

用地圖的其余部分縮放點。