D3投影は非常に小さいSVGをプロットする

Question

私はgeoAlbers投影を使用してプロットしているサンフランシスコのtopoJSONデータを持っています。しかし、結果として得られるSVGは非常に小さく、小さな仕様のようです。私はscaleとtranslateを使用しました。 svgは同じままであるか、ページから消えます。私はすでにこのリンクをチェックアウトしました：Center a map in d3 given a geoJSON object 誰かが私が間違っていることを教えてもらえますか？ここで

は私のコードです：ここでは

let width = 1050, 
    height = 900; 
const svg = d3.select('body').append('svg') 
      .attr('width', width) 
      .attr('height', height); 

d3.json('/sfmaps/sfarteriesTopo.json', (error, topology) => { 
    const b = topology.bbox; 
    const streets = topojson.feature(topology, topology.objects.arteries).features; 
    var projection = d3.geoAlbersUsa(); 
    var path = d3.geoPath().projection(projection); 
    svg.selectAll('.streets') 
      .data(streets) 
      .enter().append('path') 
      .attr('class', 'streets') 
      .attr('d', path); 

}); 

は、私が試したものです：

1. projection.scale(700)：小さなSVGの位置を移動させるが、サイズは同じまま。
2. scale(700).translate([width/2, height/2])：位置が再びシフトし、サイズは変わりません。
3. scale(2)：SVGが小さくなります。

私は初めてd3を試しています。だから、どんな指摘にも感謝しています。 ありがとうございました！

Answer 1

私は非常に小さいスケールを使用していることが分かりました。これを修正するために、私は16000のスケールを使用し、うまくいきました。私はgeoJSONオブジェクトの境界からスケールを計算しました。