javascript - d3.js 投影比例不会增加一个国家的大小

Question

我第一次尝试使用 d3.js 和 GeoJSON 构建一些东西。我设法得到一个国家 - 爱沙尼亚来展示，但它太小了，你几乎看不到它。我尝试玩投影 geoMercator().scale 但它不起作用 - 尺寸没有增加。

请看下面的图片(条形图下方):

这是我的js:

 var projection = d3.geoMercator()
            .translate([w/2, h/2])
            .scale([100]);

        var path = d3.geoPath()
            .projection(projection)



        var w3 = 2000;
        var h3 = 1500;

        var svg = d3.select("body")
            .append("svg")
            .attr("width", w3)
            .attr("height", h3)


        d3.json("estonia.json", function (json){
            svg.selectAll("path")
                .data(json.features)
                .enter()
                .append("path")
                .attr("d", path)
                .style("fill", "#2294AA");
        })

我做错了什么？

Answer 1

我拿了你的代码，发现当我增加比例时，爱沙尼亚消失了。必须像这样使投影居中:

   var projection = d3.geoMercator()
     .center([24.312863, 57.793424])
     .scale([500])
     .translate([w/2, h/2])

我从 .json 文件中获取坐标 [24.312863, 57.793424]。