d3.js 投影比例不会增加国家的面积
d3.js projection scale doesn't increase a size of a country
我第一次尝试使用 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");
})
我做错了什么?
我拿了你的代码,当我增加比例尺时,爱沙尼亚消失了。必须像这样使投影居中:
var projection = d3.geoMercator()
.center([24.312863, 57.793424])
.scale([500])
.translate([w/2, h/2])
我从 .json 文件中获取了坐标 [24.312863, 57.793424]。
我第一次尝试使用 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");
})
我做错了什么?
我拿了你的代码,当我增加比例尺时,爱沙尼亚消失了。必须像这样使投影居中:
var projection = d3.geoMercator()
.center([24.312863, 57.793424])
.scale([500])
.translate([w/2, h/2])
我从 .json 文件中获取了坐标 [24.312863, 57.793424]。