분류 전체보기

구글맵 - 오버레이(마커) 애니메이션 효과 주기

애니메이션마커를 애니메이션으로 표시하여 다양한 다른 상황에서 동적 움직임을 나타낼 수 있습니다. 마커가 애니메이션되는 방식은 마커의 animation 속성 내에google.maps.Animation 유형으로 지정합니다. 현재 다음 Animation 값이 지원됩니다.DROP은 마커가 처음 지도에 배치될 때 지도 맨 위로부터 떨어져 최종 위치에 놓여져야 함을 나타냅니다. 마커 배치가 완료되면 애니메이션이 중지되고animation이 null로 되돌아 갑니다. 이러한 유형의 애니메이션은 대개 Marker를 생성할 때 지정합니다.BOUNCE는 마커가 제자리에서 '통통 튀어야' 함을 나타냅니다. 통통 튀는 마커는 animation 속성이 명시적으로 null로 설정될 때까지 계속 튀어 오릅니다.기존 마커의 경우 Ma..

구글맵 - 오버레이(마커) 찍기

삭제코드는 있지만 구현은 안된듯하다. var map; var markersArray = []; function initialize() { var haightAshbury = new google.maps.LatLng(37.7699298, -122.4469157); var mapOptions = { zoom: 12, center: haightAshbury, mapTypeId: google.maps.MapTypeId.TERRAIN }; map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); google.maps.event.addListener(map, 'click', function(event) { addMarker(event..

구글맵 - 스타일링

스타일링개요스타일 구문지도 기능Stylers스타일 배열의 예기본 맵 스타일링만들기 StyledMapType을스타일지도 마법사개요지도 스타일은 표준 Google지도에서 사용되는 그것보다 다른 스타일을 반영하기 위해 도로, 공원, 조립 분야와 같은 요소의 시각적 표시를 변경, 표준 Google 기본지도의 프레 젠 테이션을 사용자 정의할 수 있습니다.지도에 스타일을 적용하는 두 가지 방법이 있습니다 :설정하여 . 스타일 지도의 재산 MapOptions의 개체를. 이 방법은 표준지도 유형 (지형 및 위성보기에서 기본 이미지가 영향을하지만, 도로, 라벨 등을 존중 스타일링 규정되지 않은)의 스타일을 변경합니다. 참고 기본 맵 스타일링 .만들고 정의하여 StyledMapType을 하고지도에 적용. 이것은지도 형식 ..

구글맵 - 컨트롤에 상태 추가하기 (예제 - 위치저장하기)

컨트롤에 상태 추가하기컨트롤이 상태를 보관할 수도 있습니다. 다음 예는 위에 표시된 예와 비슷하지만, 새로운 홈 위치를 표시하도록 컨트롤을 설정하는 추가 '홈 설정' 버튼이 컨트롤에 포함됩니다. 이 작업은 컨트롤에 상태를 저장하고 해당 상태에 대한 getters 및 setters를 제공할 home_ 속성을 만들어서 수행합니다.var map; var chicago = new google.maps.LatLng(41.850033, -87.6500523); /** * The HomeControl adds a control to the map that * returns the user to the control's defined home. */ // Define a property to hold the Home ..

구글맵 - 맞춤형 컨트롤

맞춤형 컨트롤사용자와의 상호작용을 처리하기 위해 기존 API 컨트롤의 스타일과 위치를 수정하는 것은 물론 자신의 고유한 컨트롤을 만들 수도 있습니다. 컨트롤은 절대 위치에서 지도 위에 떠 있는 정지된 위젯으로서, 밑에 있는 지도와 함께 움직이는 오버레이와는 다릅니다. 좀 더 기본적으로 말하면 컨트롤은 지도 상의 절대 위치에 있는 요소로서 사용자에게 UI를 표시하고 주로 이벤트 핸들러를 통해 사용자나 지도와 상호작용합니다.고유한 맞춤형 컨트롤을 만들려면 몇 가지 '규칙'이 필요합니다. 다음 가이드라인을 참조하면 도움이 됩니다.표시할 컨트롤 요소에 대한 적절한 CSS를 정의합니다.지도 속성 변경이나 사용자 이벤트(예: 'click' 이벤트)에 대한 이벤트 핸들러를 통해 사용자나 지도와의 상호작용을 처리합니다..

구글맵 - 컨트롤 배치

컨트롤 배치하기각 컨트롤 옵션에는 컨트롤을 배치할 지도의 위치를 나타내는 ControlPosition 유형의 position 속성이 포함되어 있습니다. 이러한 컨트롤을 반드시 배치할 필요는 없습니다. API가 지도 크기 등 지정된 제약조건 내에서 기존 지도 요소나 다른 컨트롤 주변에 '흐르게' 하여 지능적으로 컨트롤의 레이아웃을 지정합니다. 참고: API는 컨트롤을 지능적으로 정렬하지만 지정된 복잡한 레이아웃에서 컨트롤이 겹치지 않는다고 보장할 수는 없습니다.지원되는 컨트롤 위치는 다음과 같습니다.TOP_CENTER - 지도의 상단 중심을 따라 컨트롤을 배치해야 합니다.TOP_LEFT - 지도의 왼쪽 상단을 따라, 컨트롤의 하위 요소가 상단 중심을 향해 '흐르도록' 하여 컨트롤을 배치해야 합니다.TOP_..

구글맵 - 컨트롤 옵션

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

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

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