svg에서 OpenStreetMap 항목 그리기

OpenStreetMap의 영역은 브라우저의 SVG에 그릴 모든 영역의 좌표를 포함하는 배열로 변환됩니다.svg에서 OpenStreetMap 항목 그리기

[ 
    "48.2290963 16.3522533", 
    "48.2294087 16.3521388", 
    "48.2294249 16.3525140", 
    "48.2297088 16.3523572", 
    "48.2298889 16.3523674", 
    "48.2299063 16.3528332", 
    "48.2293137 16.3529256", 
    "48.2293106 16.3525268", 
    "48.2291061 16.3525292", 
    "48.2291009 16.3523838", 
    "48.2290963 16.3522533" 
]

배열 영역의 모든 꼭지점 (각 서브 어레이의 첫 번째 요소는 X, Y가 두 번째 좌표 인)을 포함한다. points="" 특성은 상기 어레이의 값으로 충전된다 어디 <polygons>와 <svg>를 생성하면

는 아무것도의 표시, 논리적 인 :

숫자는 매우 높고 마지막 소수점 다르다.

눈에 잘 띄는 영역을 렌더링하려면지도 데이터 옆에있는 "빈 마일"을 제거해야합니다.

어떻게하면됩니까?

출처

2017-10-04 Örom Loidl

여러 가지 옵션이 있습니다 :

는 svg 요소, 예를 들어,에 viewBox 속성을 사용 viewBox="48.229 16.352 0.001 0.001"는 :
다각형을 생성하기 전에 좌표 변환 적절한 translate 및 scale
와 transform를 사용 (NB 사파리는 이와 같은 아주 작은 폭을 갖는 문제의 비트를 보인다). - 및 *으로 충분해야합니다.

출처

2017-10-04 18:56:27 jcaron

svg에서 OpenStreetMap 항목 그리기

답변

관련 문제