AdvancedMarkerElement 클래스
google.maps.marker.AdvancedMarkerElement
클래스
지도에 위치를 표시합니다. AdvancedMarkerElement
를 표시하려면 position
를 설정해야 합니다.
참고: 웹 구성요소로 사용하는 방식 (예: 맞춤 <gmp-advanced-marker>
HTML 요소 사용은 v=beta
채널에서만 사용 가능)
맞춤 요소:
<gmp-advanced-marker position="lat,lng" title="string"></gmp-advanced-marker>
이 클래스는 HTMLElement
를 확장합니다.
이 클래스는 AdvancedMarkerElementOptions
를 구현합니다.
const {AdvancedMarkerElement} = await google.maps.importLibrary("marker")
를 호출하여 액세스합니다. Maps JavaScript API의 라이브러리를 참고하세요.
생성자 | |
---|---|
AdvancedMarkerElement |
AdvancedMarkerElement([options]) 매개변수:
지정된 옵션으로 AdvancedMarkerElement 를 만듭니다. 지도를 지정하면 생성 시 AdvancedMarkerElement 가 지도에 추가됩니다. |
속성 | |
---|---|
collisionBehavior |
유형:
CollisionBehavior optional AdvancedMarkerElementOptions.collisionBehavior 페이지를 참고하세요. |
content |
유형:
Node optional AdvancedMarkerElementOptions.content 페이지를 참고하세요. |
element |
유형:
HTMLElement 이 필드는 읽기 전용입니다. 뷰를 지원하는 DOM 요소. |
gmpClickable |
유형:
boolean optional AdvancedMarkerElementOptions.gmpClickable 페이지를 참고하세요. |
gmpDraggable |
유형:
boolean optional AdvancedMarkerElementOptions.gmpDraggable 페이지를 참고하세요. |
map |
유형:
Map optional AdvancedMarkerElementOptions.map 페이지를 참고하세요. |
position |
유형:
LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optional AdvancedMarkerElementOptions.position 페이지를 참고하세요.HTML 속성:
|
title |
유형:
string AdvancedMarkerElementOptions.title 페이지를 참고하세요.HTML 속성:
|
zIndex |
유형:
number optional AdvancedMarkerElementOptions.zIndex 페이지를 참고하세요. |
방법 | |
---|---|
addEventListener |
addEventListener(type, listener[, options]) 매개변수:
반환 값:
void 지정된 이벤트가 대상에 전달될 때마다 호출될 함수를 설정합니다. addEventListener를 참조하세요. |
addListener |
addListener(eventName, handler) 매개변수:
반환 값:
MapsEventListener 결과 이벤트 리스너입니다.지정된 리스너 함수를 지도 이벤트 시스템의 지정된 이벤트 이름에 추가합니다. |
removeEventListener |
removeEventListener(type, listener[, options]) 매개변수:
반환 값:
void 이전에 addEventListener로 등록된 이벤트 리스너를 타겟에서 삭제합니다. removeEventListener를 참조하세요. |
이벤트 | |
---|---|
click |
function(event) 인수:
|
drag |
function(event) 인수:
|
dragend |
function(event) 인수:
|
dragstart |
function(event) 인수:
|
gmp-click |
function(event) 인수:
이 이벤트는 AdvancedMarkerElement 요소를 클릭하면 실행됩니다. addListener() 대신 addEventListener() 와 함께 사용하는 것이 가장 좋습니다. |
AdvancedMarkerElementOptions 인터페이스
google.maps.marker.AdvancedMarkerElementOptions
인터페이스
AdvancedMarkerElement
구성을 위한 옵션입니다.
속성 | |
---|---|
collisionBehavior optional |
유형:
CollisionBehavior optional AdvancedMarkerElement 가 다른 AdvancedMarkerElement 과 충돌하거나 벡터 지도의 기본 지도 라벨과 충돌할 때 작동 방법을 지정하는 열거형입니다. 참고: |
content optional |
유형:
Node optional 기본값:
PinElement.element AdvancedMarkerElement 의 시각적 요소를 지원하는 DOM 요소입니다. 참고: |
gmpClickable optional |
유형:
boolean optional 기본값:
false true 인 경우 AdvancedMarkerElement 를 클릭할 수 있고 gmp-click 이벤트를 트리거하며 접근성 목적으로 대화형입니다 (예: 화살표 키를 통한 키보드 탐색 허용). |
gmpDraggable optional |
유형:
boolean optional 기본값:
false true 이면 AdvancedMarkerElement 를 드래그할 수 있습니다. 참고: 고도가 있는 |
map optional |
유형:
Map optional AdvancedMarkerElement 를 표시할 지도입니다. 지도는 AdvancedMarkerElement 를 표시하는 데 필요하며 생성 시 제공되지 않으면 AdvancedMarkerElement.map 를 설정하여 제공할 수 있습니다. |
position optional |
유형:
LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optional AdvancedMarkerElement 의 위치를 설정합니다. AdvancedMarkerElement 는 위치 없이 구성할 수 있지만 사용자의 작업이나 선택 등으로 위치가 제공될 때까지 표시되지 않습니다. 생성 시 제공되지 않으면 AdvancedMarkerElement.position 를 설정하여 AdvancedMarkerElement 의 위치를 제공할 수 있습니다. 참고: 고도가 있는 |
title optional |
유형:
string optional 텍스트를 롤오버합니다. 제공된 경우 접근성 텍스트 (예: 스크린 리더와 함께 사용)가 제공된 값과 함께 AdvancedMarkerElement 에 추가됩니다. |
zIndex optional |
유형:
number optional 모든 AdvancedMarkerElement 은 zIndex 순으로 지도에 표시되며 값이 더 높은 AdvancedMarkerElement 이 값이 더 작은 AdvancedMarkerElement 앞에 표시됩니다. 기본적으로 AdvancedMarkerElement 는 화면의 세로 위치에 따라 표시되며, 낮은 AdvancedMarkerElement 가 화면 위쪽의 AdvancedMarkerElement 앞에 표시됩니다. zIndex 는 CollisionBehavior.OPTIONAL_AND_HIDES_LOWER_PRIORITY 고급 마커 간의 상대적 우선순위를 결정하는 데 도움을 주기도 합니다. zIndex 값이 클수록 우선순위가 높습니다. |
AdvancedMarkerClickEvent 클래스
google.maps.marker.AdvancedMarkerClickEvent
클래스
이 이벤트는 고급 마커를 클릭하면 생성됩니다. event.target.position
를 사용하여 마커의 위치에 액세스합니다.
이 클래스는 Event
를 확장합니다.
const {AdvancedMarkerClickEvent} = await google.maps.importLibrary("marker")
를 호출하여 액세스합니다. Maps JavaScript API의 라이브러리를 참고하세요.
PinElement 클래스
google.maps.marker.PinElement
클래스
PinElement
는 도형과 글리프로 구성된 DOM 요소를 나타냅니다. 도형은 기본 AdvancedMarkerElement
에 표시된 것과 동일한 풍선 스타일을 사용합니다. 글리프는 풍선 모양에 표시되는 선택적 DOM 요소입니다. PinElement
는 PinElement.scale
에 따라 가로세로 비율이 다를 수 있습니다.
참고: 웹 구성요소로 사용 (예: HTMLElement 서브클래스로 사용 또는 HTML을 통해 사용)은 아직 지원되지 않습니다.
이 클래스는 HTMLElement
를 확장합니다.
이 클래스는 PinElementOptions
를 구현합니다.
const {PinElement} = await google.maps.importLibrary("marker")
를 호출하여 액세스합니다. Maps JavaScript API의 라이브러리를 참고하세요.
생성자 | |
---|---|
PinElement |
PinElement([options]) 매개변수:
|
속성 | |
---|---|
background |
유형:
string optional PinElementOptions.background 페이지를 참고하세요. |
borderColor |
유형:
string optional PinElementOptions.borderColor 페이지를 참고하세요. |
element |
유형:
HTMLElement 이 필드는 읽기 전용입니다. 뷰를 지원하는 DOM 요소. |
glyph |
PinElementOptions.glyph 페이지를 참고하세요. |
glyphColor |
유형:
string optional PinElementOptions.glyphColor 페이지를 참고하세요. |
scale |
유형:
number optional PinElementOptions.scale 페이지를 참고하세요. |
방법 | |
---|---|
addEventListener |
addEventListener(type, listener[, options]) 매개변수:
반환 값:
void 이 함수는 아직 사용할 수 없습니다. |
removeEventListener |
removeEventListener(type, listener[, options]) 매개변수:
반환 값:
void 이전에 addEventListener로 등록된 이벤트 리스너를 타겟에서 삭제합니다. removeEventListener를 참조하세요. |
PinElementOptions 인터페이스
google.maps.marker.PinElementOptions
인터페이스
PinElement
생성을 위한 옵션입니다.
속성 | |
---|---|
background optional |
유형:
string optional 핀 도형의 배경색입니다. 모든 CSS 색상 값을 지원합니다. |
borderColor optional |
유형:
string optional 핀 도형의 테두리 색상입니다. 모든 CSS 색상 값을 지원합니다. |
glyph optional |
핀에 표시되는 DOM 요소입니다. |
glyphColor optional |
유형:
string optional 글리프의 색상입니다. 모든 CSS 색상 값을 지원합니다. |
scale optional |
유형:
number optional 기본값:
1 핀의 크기입니다. |