[D3] d3-geo paths 사용법(우리나라 지도 그리기)

d3는 GeoJSON를 사용하여 javascript에서 지리적 특징을 나타냅니다. 컴팩트한 TopoJSON도 있습니다.

Paths

GeoJSON 객체가 주어지면 SVG 경로 데이터 문자열 또는 Canvas를 생성합니다.

d3.geoPath(projection, context)

기본 설정으로 새 지리적 경로 생성기를 만듭니다.

path(object, ...arguments)

GeoJSON 객체를 렌더링합니다.

• Point - 단일 위치
• MultiPoint - 위치 배열
• LineString - 연속적인 선을 형성하는 위치 배열
• MultiLineString - 여러 줄을 형성하는 위치 배열의 배열
• Polygon - 다각형을 형성하는 위치 배열의 배열
• MultiPolygon - 여러 다각형을 형성하는 다차원 배열
• GeometryCollection - 기하학 개체의 배열
• Feature - 기하학 개체 중 하나를 포함
• FeatureCollection - Feature 개체의 배열

Sphere 유형도 지원되며 지구의 윤곽을 렌더링하는 데 유용합니다. 구에는 좌표가 없습니다.

개별 경로 요소는 단일 경로 요소보다 느립니다.그러나 상호 작용에 유용합니다. canvas는 svg보다 더 빠릅니다.

path.area(object)

GeoJSON 객체에 대해 투영된 평면 영역을 반환합니다. 다각형일 경우 먼저 외부 면적을 계산 후 내부의 면적을 뺍니다.

path.bounds(object)

GeoJSON 객체에 대해 투영된 투영된 평면 경계를 반환합니다. 2차원 배열로 표시됩니다. 특정 기능을 확대할 때 편리합니다.

path.centroid(object)

GeoJSON 객체에 대해 투영된 평면 중심을 반환합니다. 기호 지도를 표시하는 데 유용합니다.

path.digits(digits)

digits가 지정된 경우 SVG 경로 문자열에 생성된 좌표의 소수 자릿수를 설정합니다. 기본값은 3입니다.

path.measure(object)

GeoJSON 객체에 대해 투영된 평면 길이를 반환합니다. 다각형일 경우 모든 링의 합산 길이를 계산합니다.

path.projection(projection)

투영이 지정된 경우 현재 투영을 지정된 투영으로 설정합니다. 지정되지 않은 경우 현재 투영을 반환합니다.

path.context(context)

context가 지정되면 현재 렌더링 context를 설정하고 path 생성기를 반환합니다. context가 null이면 svg 경로 문자열을 반환합니다.

path.pointRadius(radius)

점 형상을 표시하는 데 사용되는 반경을 숫자로 설정합니다. 기본값은 4.5입니다.