Backup

구글맵 - 컨트롤 옵션

컨트롤 옵션여러 컨트롤을 구성하여 컨트롤의 동작이나 모양을 변경할 수 있습니다. 예를 들어 확대/축소 컨트롤은 슬라이더가 있는 전체 확대/축소 컨트롤과 함께 큰 컨트롤로 표시되거나 작은 지도의 경우 작은 미니 확대/축소 컨트롤로 표시될 수 있습니다.이러한 컨트롤은 지도를 만들 때 MapOptions 객체에서 해당 컨트롤 options 필드를 변경하여 수정할 수 있습니다. 예를 들어 확대/축소 컨트롤을 수정하는 옵션은 zoomControlOptions 필드에 지정됩니다.확대/축소 컨트롤은 다음 style 옵션 중 하나로 표시될 수 있습니다.google.maps.ZoomControlStyle.SMALL은 + 및 - 버튼만으로 구성된 미니 확대/축소 컨트롤을 표시합니다. 이 스타일은 작은 지도에 적합합니다. ..

구글맵 - 지도에 컨트롤 추가 & 삭제

지도에 컨트롤 추가하기UI 동작 또는 컨트롤을 제거, 추가 또는 수정하고 이후의 업데이트로 인해 동작이 변경되지 않게 하여 인터페이스를 원하는 대로 조정할 수 있습니다. 기존 동작을 추가하거나 수정하기만 하려는 경우 애플리케이션에 컨트롤을 명시적으로 추가해야 합니다.일부 컨트롤은 지도에 기본적으로 표시되지만 다른 컨트롤은 특별히 요청하지 않는 한 표시되지 않습니다. 지도에서 컨트롤을 추가하거나 제거하는 것은 Map options 객체의 필드에서 지정하는데, 컨트롤을 표시하려면 true로 설정하고 숨기려면 false로 설정합니다.{ panControl: boolean, zoomControl: boolean, mapTypeControl: boolean, scaleControl: boolean, streetV..

구글맵 API - DOM 이벤트 수신하기

DOM 이벤트 수신하기Google Maps Javascript API 이벤트 모델은 자체 맞춤 이벤트를 만들고 관리합니다. 그런데 브라우저의 DOM(Document Object Model)도 사용 중인 특정 브라우저 이벤트 모델에 따라 자체 이벤트를 만들고 전달합니다. 이 이벤트를 캡쳐하고 응답하려는 경우 Maps API는 addDomListener() 정적 메소드를 제공하여 DOM 이벤트를 수신하고 바인딩합니다.이 편리한 메소드에는 아래에 표시된 것처럼 서명이 있습니다.addDomListener(instance:Object, eventName:string, handler:Function)여기에서 instance는 다음을 비롯하여 브라우저에서 지원하는 DOM 요소일 수 있습니다.DOM의 계층적 멤버(예:..

구글맵 이벤트 - 속성 가져오기 (예제-줌속성)

이벤트 핸들러 내에서 속성 가져오기 및 설정하기Maps API 이벤트 시스템에서 MVC 상태 변경 이벤트는 이벤트가 트리거될 때 인자를 전달하지 않습니다. 반면 사용자 이벤트는 검사할 수 있는 인자를 전달합니다. MVC 상태 변경에 대한 속성을 검사해야 하는 경우 객체에 대해 적절한 getProperty() 메소드를 명시적으로 호출해야 합니다. 검사에서는 항상 MVC 객체의 현재 상태를 가져오므로 이벤트가 처음 발생된 때의 상태가 아닐 수도 있습니다.참고: 특정 속성의 상태 변경에 응답하는 이벤트 핸들러 내에서 속성을 명시적으로 설정하면 예기치 않거나 원하지 않은 동작이 생성될 수 있습니다. 예를 들어, 속성 설정은 새로운 이벤트를 트리거하고 항상 이벤트 핸들러 내에서 속성을 설정하는 경우 무한 루프가 ..

구글맵 이벤트 - 클릭하면 메세지창출력

이벤트 리스너에서 클로저 사용하기이벤트 리스너를 실행할 때는 비공개 및 영구 데이터를 모두 객체에 연결할 수 있다는 장점이 있습니다. 자바스크립트는 '비공개' 인스턴스 데이터는 지원하지 않지만 내부 함수가 외부 변수에 액세스할 수 있도록 해 주는 클로저를 지원합니다. 클로저를 사용하면 이벤트 리스너에서 이벤트가 발생한 객체에 속하지 않은 변수에 액세스할 수 있습니다.다음 예에서는 이벤트 리스너에서 함수 클로저를 사용하여 마커 집합에 비밀 메시지를 할당합니다. 각 마커를 클릭하면 마커 자체에 포함되지 않은 비밀 메시지의 일부를 검토하게 됩니다.var map; function initialize() { var myLatlng = new google.maps.LatLng(-25.363882,131.044922..

구글맵 이벤트 - 클릭한곳 마커찍기

UI 이벤트에서 인자 액세스하기Google Maps API V3의 UI 이벤트는 일반적으로 이벤트 인자를 전달합니다. 이벤트 인자는 이벤트 발생 시 UI 상태를 알리는 이벤트 리스너를 사용해 액세스할 수 있습니다. 예를 들어 UI 'click' 이벤트는 일반적으로 지도의 클릭된 위치를 나타내는 latLng 속성이 포함된 MouseEvent를 전달합니다. 위 동작은 UI 이벤트에 고유하며 MVC 상태 변경 이벤트에서는 인자를 전달하지 않습니다.객체 속성에 액세스하는 방식과 동일하게 이벤트 리스너 내의 이벤트 인자에 액세스할 수 있습니다. 다음 예제에서는 지도에 대한 이벤트 리스너를 추가하고 사용자가 지도를 클릭할 때 클릭된 위치에서 마커를 만듭니다.var map; function initialize() {..

구글맵 이벤트 - 클릭하면 이동

addListener() 이벤트 핸들러를 사용하여 이벤트 알림을 등록합니다. 이 메소드는 객체, 수신할 이벤트, 지정된 이벤트가 발생할 때 호출할 함수를 받습니다.다음 코드는 사용자 이벤트와 상태 변경 이벤트를 함께 사용합니다. 클릭하면 지도를 확대/축소하는 이벤트 핸들러를 마커에 연결합니다. 또한 'zoom' 속성 변경사항에 대한 이벤트 핸들러를 지도에 추가하고 zoom_changed 이벤트 수신 시 지도를 오스트레일리아 북부, 다윈으로 이동합니다.var map; function initialize() { var myLatlng = new google.maps.LatLng(-25.363882,131.044922); var myOptions = { zoom: 4, center: myLatlng, mapT..

구글맵 사용자 위치탐색 navigator.geolocation & google.gears

사용자의 위치 탐색브라우저에서 사용자의 위치를 탐색하는 방법에는 현재 여러 가지가 있습니다. 이러한 방법 중 어떤 것도 Google Maps API에 속하지 않지만, 대신 이들은 모두 공용 업계 표준입니다.최신 브라우저에서는 W3C Geolocation 표준을 지원하기 시작했습니다. 이 표준은 HTML5의 일부이며 향후 사실상의 표준이 될 가능성이 있습니다. Geolocation을 수행하려는 모든 애플리케이션은 이 표준을 지원해야 합니다.Google Gears가 포함된 일부 브라우저는 Google Gears Geolocation API를 사용할 수 있습니다. 하지만 W3C 표준에 대한 광범위한 지원이 계속 진행될 것이므로 Gears를 확인해두는 것이 좋습니다.일부 브라우저는 IP 주소를 사용하여 사용자의..