Bostock의 map tutorial에이어서 data을 따르고 있습니다. 투영은 3D 위도/경도 좌표를 사용하고 2D x/y 좌표를 반환하는 함수라는 것을 알고 있습니다. 또한 d3.geo.path가 GeoJSON을 SVG로 변환하는 지저분한 사업을 처리한다는 것을 이해합니다. GeoJSON이 2D SVG에 기술 한 3D lat/long을 투영하는 방법을 알려주기 위해 d3.geo.path에 매개 변수로 프로젝션 함수를 전달하는 방법을 설명합니다. 여태까지는 그런대로 잘됐다.내 d3지도를 조정하는 데 문제가 있습니다
그러나 내지도에서 "투영"하는 데 많은 어려움을 겪고 있습니다. 지도는 투영의 중심 속성을 사용하여 적절한 위도와 경도의 중앙에 배치됩니다. 나는 projection의 translate 속성을 사용하여 점을 SVG 요소의 가운데에 놓습니다. 그러나 규모에 관계없이 숫자가 아무리 많아도지도가 더 크거나 작아지지 않습니다. 나는 골치 거리의 실수를 점검했다. 나는 변화를 적절하게 저장하고 있으며, 올바르게 적응하고있다. 그 오류는 내가 어떻게 규모를 사용하는지에 달려있다.
어떻게 확대합니까?
window.onload = function() {
//Width and height
var width = 960,
height = 1160;
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height);
//setting scale to numbers as high as 30000 and as low as 3 does not change my map
var projection = d3.geo.transverseMercator().translate([width/2, height/2]).scale(3).center(-90.088, 29.957);
var path = d3.geo.path(projection);
d3.json("orleans.json", function(json) {
svg.selectAll("path")
.data(json.features)
.enter()
.append("path")
.attr("d", path);
});
};