2013-09-07 5 views
4

다음은 D3.js와 topojson을 사용하는 홍수지도의 예입니다. D3.js 홍수지도 킬러

http://bl.ocks.org/cappelaere/6472064

정말 D3를 과세한다

https://gist.github.com/cappelaere/6472064

. 로드 타임에 topojson을 단순화하면 Firefox가 중단되는 것 같습니다. 우리는 재난 관리 업무를 지원하기 위해이 일을 실제로 수행해야합니다. 우리가 확대함에 따라 적응 형 단순화를 갖는 것이 좋을 것입니다. 어떤 도움이라도 대단히 감사하겠습니다. 감사합니다.

Pat.

+0

그래서 실제 질문은 무엇입니까? –

+0

안녕하세요. 우리가 짧은 아직 완전한 질문을 작성하는 방법을보기 위해 다른 질문을 읽으라고 조언합니다. 잠긴 장소를 정확하게 알려주는 것이 중요합니다. – Hugolpz

+0

D3는 topojson.presimplify뿐만 아니라 확대/축소 및 팬에서 질식하는 것처럼 보이지만 MapShaper는 동일한 파일을 단순화하고 렌더링하는 데 문제가없는 것 같습니다. (파일이 단순화 될 수 있다는 것을 알고 있지만 이것은 문제가 아닙니다 ... 실제로 표시 할 데이터가 더 많습니다 ...) –

답변

3

거의 유일한 선택은 확대/축소 수준에 따라로드 된 미리 설정된 데이터 세트를 갖는 것입니다. 즉, 각 확대/축소 후 사용자가 확대 한 영역에 대해 새롭고 더 높은 해상도의 데이터 세트를로드할지 여부를 결정해야합니다. 그렇다면 기존 요소를 지우고 새 요소를 추가해야합니다.

이것은 많은 노력이 될 것입니다. 이 시점에서 미리 렌더링 된 비트 맵 타일 (예 : Google지도와 같은)을 사용하고 무거운 짐을지는 Leaflet과 같은 라이브러리를 사용할 수 있습니다. 이 사전 렌더링 된지도 위에는 여전히 동적 인 작업을 위해 D3을 사용할 수 있습니다.

+0

벡터를 사용하는 것은 수치스럽고 모든 사람들이 벡터 렌더링을 할 때 래스터로 다시 변환하여 표시해야합니다. 이 경우 전단지는 도움이되지 않습니다. 다양한 줌 레벨에서 즉각적인 단순화가 필요합니다. 그것은 doable (www.mapshaper.org 참조) 보이지만 기존의 동적 단순화를 사용하여 지금까지 D3와 비슷한 결과를 얻을 수없는 것 같습니다 ... –

+0

이것은 여전히 ​​브라우저에 상당히 많은 요구 사항을 넣을 것입니다. 거기에서 할 수있는 것에는 한계가 있으며 (특히 모바일 장치에서 제대로 작동하기를 원한다면) 응용 프로그램이 그러한 경우 인 것 같습니다. 마찬가지로 언제든지 Google지도가 전적으로 벡터 기반으로 표시되는 것을 볼 수 없습니다. –

+0

Google지도와 OpenStreetMaps는 모두 벡터 기반이며 (최소한 베타 버전과 거의 생산 중이므로 뒤로 돌아 가지 않습니다.) 다른 하나는 선 단순화가 좋지만 다음과 같은 곡선 피팅을 따라야한다는 것입니다. http : //willowsystems.github.io/jSignature/#/about/linesmoothing/ –