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 | 
content | 
유형:   
Node optional | 
element | 
유형:   
HTMLElement이 필드는 읽기 전용입니다. 뷰를 지원하는 DOM 요소입니다.  | 
 | 
유형:   
boolean optional | 
gmpDraggable | 
유형:   
boolean optional | 
map | 
유형:   
Map optionalAdvancedMarkerElementOptions.map를 참조하세요. | 
position | 
유형:   
LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalHTML 속성: 
  | 
title | 
유형:   
stringHTML 속성: 
  | 
zIndex | 
유형:   
number optional | 
메서드 | |
|---|---|
 | 
addEventListener(type, listener[, options])매개변수:   
 반환 값:   
void지정된 이벤트가 타겟에 전달될 때마다 호출될 함수를 설정합니다. addEventListener 참고  | 
addListener | 
addListener(eventName, handler)매개변수:   
 반환 값:   
MapsEventListener 결과 이벤트 리스너입니다.Maps Eventing 시스템의 지정된 이벤트 이름에 지정된 리스너 함수를 추가합니다.  | 
 | 
removeEventListener(type, listener[, options])매개변수:   
 반환 값:   
void이전에 addEventListener로 등록된 이벤트 리스너를 타겟에서 삭제합니다. removeEventListener을 참고하세요.  | 
이벤트 | |
|---|---|
click | 
function(event)인수:   
  | 
drag | 
function(event)인수:   
  | 
dragend | 
function(event)인수:   
  | 
dragstart | 
function(event)인수:   
  | 
 | 
function(event)인수:   
  | 
AdvancedMarkerElementOptions 인터페이스
google.maps.marker.AdvancedMarkerElementOptions
인터페이스
AdvancedMarkerElement 생성 옵션
속성 | |
|---|---|
collisionBehavior optional | 
유형:   
CollisionBehavior optionalAdvancedMarkerElement가 다른 AdvancedMarkerElement 또는 벡터 지도의 기본 지도 라벨과 충돌할 때의 동작을 지정하는 열거형입니다. 참고:   | 
content optional | 
유형:   
Node optional기본값:  
PinElement.elementAdvancedMarkerElement의 시각적 요소를 지원하는 DOM 요소입니다. 참고:   | 
 | 
유형:   
boolean optional기본값:  
falsetrue인 경우 AdvancedMarkerElement가 클릭 가능하고 gmp-click 이벤트를 트리거하며, 접근성 목적으로 상호작용이 가능하게 됩니다 (예: 화살표 키를 통한 키보드 탐색 허용). | 
gmpDraggable optional | 
유형:   
boolean optional기본값:  
falsetrue이면 AdvancedMarkerElement을 드래그할 수 있습니다. 참고: 고도가 있는   | 
map optional | 
유형:   
Map optionalAdvancedMarkerElement를 표시할 지도입니다. 지도는 AdvancedMarkerElement를 표시하는 데 필요하며, 생성 시 제공되지 않은 경우 AdvancedMarkerElement.map을 설정하여 제공할 수 있습니다. | 
position optional | 
유형:   
LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalAdvancedMarkerElement의 위치를 설정합니다. AdvancedMarkerElement는 위치 없이 구성될 수 있지만 위치가 제공될 때까지 표시되지 않습니다(예: 사용자의 작업이나 선택에 의해). AdvancedMarkerElement의 위치는 생성 시 제공되지 않은 경우 AdvancedMarkerElement.position을 설정하여 제공할 수 있습니다. 참고: 고도가 있는   | 
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 optionalPinElementOptions.background를 참조하세요. | 
borderColor | 
유형:   
string optionalPinElementOptions.borderColor를 참조하세요. | 
element | 
유형:   
HTMLElement이 필드는 읽기 전용입니다. 뷰를 지원하는 DOM 요소입니다.  | 
glyph | 
PinElementOptions.glyph를 참조하세요. | 
glyphColor | 
유형:   
string optionalPinElementOptions.glyphColor를 참조하세요. | 
scale | 
유형:   
number optionalPinElementOptions.scale를 참조하세요. | 
메서드 | |
|---|---|
 | 
addEventListener(type, listener[, options])매개변수:   
 반환 값:   
void이 함수는 아직 사용할 수 없습니다.  | 
 | 
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핀의 크기입니다.  |