D3 v4에서 GeoJson 파일 렌더링이 제대로 조정되지 않았습니다.

Question

GeoJSON 데이터를 사용하여 오버레이가있는지도를 렌더링하려고합니다. 나는 데이터를 QGIS와 mapshaper에 로딩했고 올바르게 렌더링한다. 그러나 내 JavaScript 코드가 예상 한대로 렌더링되지 않습니다 (SVG 전체가 채워져 스케일링 문제라고 생각하게 만듭니다.)

스케일을 계산하는 코드가 정확하다고 생각합니다.

var bounds = path.bounds(us), 
     scale = .95/Math.max((bounds[1][0] - bounds[0][0])/width, (bounds[1][1] - bounds[0][1]) /height), 
     translation = [(width - scale * (bounds[1][0] + bounds[0][0]))/2, (height - scale * (bounds[1][1] + bounds[0][1]))/2]; 

나는 plunker https://plnkr.co/edit/jzXRaOs2xXpZuJraMq3p에 내 샘플 프로젝트를 업로드했습니다. 문제는 당신 geojson에있다

Answer 1

:이 데이터는 데이터를 것으로 예상된다

... coordinates":[[[1983816.6475302426,681422.0990409602], ... 

을 그게 좌표의 2 차원 직교 시스템을 사용하고, 같은

예상되는 결과가 보일 것입니다. D3 투영법은 동쪽/서쪽으로 180도 이상, 북쪽/남쪽으로 90도 이하의 값을 갖는 롱 롱 쌍 (3 차원 지구상의 점)을 사용합니다. D3에서 long 쌍을 어레인지하는 특정 타원체는 WGS84 데이텀에 정의되어 있습니다. D3은 지리 데이터가이 좌표 공간 내에 위치 할 것으로 기대합니다.

질문에서 참조한 자동 크기 조정 기능을 사용하려면 WGS84에 있도록 데이터를 재 투영해야합니다 (또는 이미이 공간 참조를 사용하는 미국 geojson을 찾으십시오) 체계). mapshaper과 같은 도구를 사용하면 데이터를 온라인으로 변환 할 수 있습니다 (변환을 적용하기 전에 데이터에서 사용하는 공간 참조 시스템을 지정해야 할 수도 있음).

또 다른 옵션은 이미 투영 된 데이터를 축척하기 위해 geoTransform (v3)을 사용하는 것입니다. 데이터가 이미 직교 좌표계에서 2 차원이기 때문에 단순히 svg 좌표 공간에 맞게 크기를 조정하는 함수를 만들면됩니다. 나는 이것에 대한 자동 확장 기능에 대해서는 생각하지 않았지만 가능해야한다. geo.transform의 예는 (a 유사한 지리적 피쳐 세트) 여기되어 mapshaper 및 QGIS 여러 다른 공간 기준 시스템을 예상 된 바와 같이, 투영 경우

가

https://bl.ocks.org/andrew-reid/496078bd5e37fd22a9b43fd6be84b36b

(이들은 일반적으로 데이터를 표시 할 데이터에서 지정되거나 일반 x, y 데이터로 표시되므로 다른 플랫폼에서 작동하지만 d3 예측에서는 작동하지 않는 것처럼 보이며 모든 데이터가 긴 쌍으로 간주됩니다.