2011-05-05 4 views
8

하나의 큰 캔버스가 오버레이보기 인 Google지도의 예가 있습니까? 지도를 확대하거나 이동할 때마다 캔버스를 배치하는 데 어려움을 겪고 있습니다.Google지도에서 오버레이보기로 HTML 캔버스

+0

이것은 svg를 사용하기 때문에 꽤 답이 아닙니다. 여기에 적절한 예제가있는 d3이라는 훌륭한 라이브러리가 있습니다. https://gist.github.com/899711 예를 들어 캔버스에 적응할 수 있습니다. http://www.svgopen.org/2010/papers/62-From_SVG_to_Canvas_and_Back/index.html#canvas_to_svg 또는 fabric.js와 같은 고급 기능, 특히 https://github.com/kangax/fabric과 같은 간단한 것입니다. js/blob/d42ba6ec027274ed89c8262dfc3935b10e81f479/src/parser.js # L431 – unmounted

답변

2

지도 경계 메서드를 시도하고 현재 표시 가능한지도의 북동쪽 및 남서쪽 뷰를 가져오고 js 함수를 사용하여 각 줌에서 오버레이를 수정하여 위치를 동적으로 변경합니다.

mapBound = map.getBounds(); 
northEndOfMap =mapBound.getNorthEast(); 

지도를 얻으려면 map.getZoom();
은 참조 : http://code.google.com/apis/maps/documentation/javascript/reference.html#Map

+0

그 일을 내가 끝내었던 것과 비슷합니다. SouthWest 점에서 Northwest 점을 가져올 높이를 뺀 값을 latlng에서 픽셀로 변환하고 캔버스 상단 및 왼쪽 특성을 해당 점으로 설정합니다. 고맙습니다. – dpham

+0

확대/축소가 실제로 지구의 둘 이상의 스팬을 포함 할 정도로 낮 으면 [-190, 230]과 같이 어떻게 작동하게 할 수 있습니까? – Thomas

3

체크 아웃 기본적으로 참조 구현으로 당신을 위해 계정에이 모든 걸리는 CanvasLayer 라이브러리를.