d3：状態の代わりに国の境界ボックスIIにズーム

Question

私は、例のように米国の州地図ではなく、ワールドマップのために働いている境界ボックスIIの例へのd3ズームを取得しようとしています（https://bl.ocks.org/mbostock/raw/9656675/参照）。 。残念ながらズームは不安定です。一部の国では正常に動作します。他の人にとっては、それは太平洋に向かって勢いを変えます。

私はJSFiddle私のコードで私は遠隔地からtopojsonファイルを読み込むことができませんでした。上記の例で編集した関連機能は次のとおりです。

var projection = d3.geo.mercator() // instead of albersUsa 
    .scale(100) 
    .translate([width/2, height/2]); 

d3.json("world-110m.json", function(error, world) { //world json 
    if (error) throw error; 

    g.selectAll("path") 
    .data(topojson.feature(world, world.objects.countries).features) //traverse world objects instead of state objects 
    .enter().append("path") 
    .attr("d", path) 
    .attr("class", "feature") 
    .on("click", clicked); 

    g.append("path") 
     .datum(topojson.mesh(world, world.objects.countries, function(a, b) { return a !== b; })) // append world objects not states 
     .attr("class", "mesh") 
     .attr("d", path); 
}); 

助けてください。

注：一部の州でもズームが不安定であることがわかりました。たとえばVTまたはNHをクリックしてみてください。私はGitHubにバグを報告します。一方、任意のアイデア？

Answer 1

私は自分自身の質問に答えることを前提としています（私がそれを解決した人ではないとしても）私は正直です。

Mike Bostockは、私がd3を少し古いバージョンで実行していると言いました。少なくともD3 3.5.7を実行した後、境界VARを更新：

scale = Math.max(1, Math.min(8, 0.9/Math.max(dx/width, dy/height)))

彼も、自分のサイト上の例を修正しました。