InfoWindow 클래스
google.maps.InfoWindow
클래스
풍선처럼 보이고 종종 마커에 연결되는 오버레이입니다.
이 클래스는 MVCObject
를 확장합니다.
const {InfoWindow} = await google.maps.importLibrary("maps")
또는 const {InfoWindow} = await google.maps.importLibrary("streetView")
를 호출하여 액세스합니다. Maps JavaScript API의 라이브러리를 참고하세요.
생성자 | |
---|---|
InfoWindow |
InfoWindow([opts]) 매개변수:
지정된 옵션으로 정보 창을 만듭니다. InfoWindow는 옵션에 지정된 항목에 따라 지도의 특정 위치나 마커 위에 배치할 수 있습니다. 자동 화면 이동을 사용 중지하지 않는 한 InfoWindow는 열려 있을 때 지도를 이동하기 위해 지도를 이동합니다. InfoWindow를 생성한 후에는 open 을 호출하여 지도에 표시해야 합니다. 사용자가 InfoWindow에서 닫기 버튼을 클릭하여 지도에서 이를 제거하거나 개발자가 close()를 호출하여 동일한 효과를 얻을 수 있습니다. |
메서드 | |
---|---|
close |
close() 매개변수: 없음
반환 값: 없음
DOM 구조에서 제거하여 이 InfoWindow를 닫습니다. |
focus |
focus() 매개변수: 없음
반환 값: 없음
이 InfoWindow 에 포커스를 설정합니다. 포커스를 설정하기 전에 InfoWindow 가 표시되도록 visible 이벤트와 함께 이 메서드를 사용하는 것이 좋습니다. 표시되지 않는 InfoWindow 에는 포커스를 둘 수 없습니다. |
getContent |
getContent() 매개변수: 없음
|
getPosition |
getPosition() 매개변수: 없음
반환 값:
LatLng|null|undefined 이 InfoWindow의 LatLng 위치입니다. |
getZIndex |
getZIndex() 매개변수: 없음
반환 값:
number 이 InfoWindow의 zIndex입니다. |
open |
open([options, anchor]) 매개변수:
반환 값: 없음
지정된 지도에서 이 InfoWindow를 엽니다. 선택적으로 InfoWindow를 앵커와 연결할 수 있습니다. 핵심 API에서 유일한 앵커는 Marker 클래스입니다. 하지만 앵커는 LatLng position 속성을 노출하는 모든 MVCObject일 수 있으며 pixelOffset 를 계산하기 위한 포인트 anchorPoint 속성(선택사항)일 수도 있습니다(InfoWindowOptions 참고). anchorPoint 는 앵커 위치에서 InfoWindow 끝까지의 오프셋입니다. InfoWindowOpenOptions 인터페이스를 이 메서드의 단일 인수로 사용하는 것이 좋습니다. 열려 있을 때 브라우저 포커스가 변경되지 않도록 하려면 InfoWindowOpenOptions.shouldFocus 를 false 로 설정합니다. |
setContent |
setContent([content]) 반환 값: 없음
|
setOptions |
setOptions([options]) 매개변수:
반환 값: 없음
|
setPosition |
setPosition([position]) 매개변수:
반환 값: 없음
|
setZIndex |
setZIndex(zIndex) 매개변수:
반환 값: 없음
|
상속됨:
addListener ,
bindTo ,
get ,
notify ,
set ,
setValues ,
unbind ,
unbindAll
|
이벤트 | |
---|---|
close |
function() 인수: 없음
이 이벤트는 InfoWindow 가 닫힐 때마다 실행됩니다. 예를 들어 InfoWindow.close 메서드를 호출하거나 Esc 키를 눌러 InfoWindow를 닫거나 닫기 버튼을 클릭하거나 InfoWindow를 다른 지도로 이동할 수 있습니다. |
closeclick |
function() 인수: 없음
이 이벤트는 닫기 버튼을 클릭하면 시작됩니다. |
content_changed |
function() 인수: 없음
이 이벤트는 콘텐츠 속성이 변경되면 시작됩니다. |
domready |
function() 인수: 없음
이 이벤트는 InfoWindow 의 콘텐츠가 포함된 <div> 가 DOM에 연결되면 시작됩니다. 정보창 콘텐츠를 동적으로 작성하는 경우 이 이벤트를 모니터링하는 것이 좋습니다. |
headercontent_changed |
function() 인수: 없음
이 이벤트는 headerContent 속성이 변경되면 시작됩니다. |
headerdisabled_changed |
function() 인수: 없음
이 이벤트는 headerDisabled 속성이 변경되면 시작됩니다. |
position_changed |
function() 인수: 없음
이 이벤트는 위치 속성이 변경되면 시작됩니다. |
visible |
function() 인수: 없음
이 이벤트는 InfoWindow 가 완전히 표시되면 시작됩니다. InfoWindow 가 화면 밖으로 이동했다가 다시 화면에 표시되면 이 이벤트가 실행되지 않습니다. |
zindex_changed |
function() 인수: 없음
이 이벤트는 InfoWindow 의 zIndex가 변경되면 시작됩니다. |
InfoWindowOptions 인터페이스
google.maps.InfoWindowOptions
인터페이스
InfoWindow에서 설정할 수 있는 속성을 정의하는 데 사용되는 InfoWindowOptions 객체입니다.
속성 | |
---|---|
ariaLabel optional |
유형:
string optional InfoWindow에 할당할 AriaLabel입니다. |
content optional |
InfoWindow에 표시할 콘텐츠입니다. HTML 요소, 일반 텍스트 문자열, HTML을 포함하는 문자열일 수 있습니다. InfoWindow의 크기는 콘텐츠에 따라 조정됩니다. 콘텐츠의 크기를 명시적으로 설정하려면 콘텐츠가 해당 크기의 HTML 요소가 되도록 설정합니다. |
disableAutoPan optional |
유형:
boolean optional 기본값:
false InfoWindow가 열릴 때 완전히 표시되도록 지도 화면 이동을 사용 중지합니다. |
headerContent optional |
InfoWindow 헤더 행에 표시할 콘텐츠입니다. HTML 요소 또는 HTML을 포함하는 문자열일 수 있습니다. InfoWindow의 크기는 콘텐츠에 따라 조정됩니다. 헤더 콘텐츠에 명시적 크기를 설정하려면 headerContent를 해당 크기의 HTML 요소가 되도록 설정합니다. |
headerDisabled optional |
유형:
boolean optional InfoWindow에서 전체 헤더 행을 사용 중지합니다. true로 설정하면 헤더가 삭제되어 헤더 콘텐츠와 닫기 버튼이 숨겨집니다. |
maxWidth optional |
유형:
number optional 콘텐츠 너비와 상관없이 InfoWindow의 최대 너비입니다. 이 값은 open() 호출 전에 설정된 경우에만 고려됩니다. 콘텐츠를 변경할 때 최대 너비를 변경하려면 close() , setOptions() , open() 를 차례로 호출합니다. |
minWidth optional |
유형:
number optional 콘텐츠 너비와 상관없이 InfoWindow의 최소 너비. 이 속성을 사용할 때는 minWidth 를 지도의 너비 (픽셀 단위)보다 작은 값으로 설정하는 것이 좋습니다. 이 값은 open() 호출 전에 설정된 경우에만 고려됩니다. 콘텐츠를 변경할 때 최소 너비를 변경하려면 close() , setOptions() , open() 를 차례로 호출합니다. |
pixelOffset optional |
유형:
Size optional 지도에 정보창이 고정된 지리적 좌표에 위치한 지점으로부터 정보창의 정점에 대한 오프셋(픽셀)입니다. InfoWindow를 앵커와 함께 열면 pixelOffset 가 앵커의 anchorPoint 속성에서 계산됩니다. |
position optional |
유형:
LatLng|LatLngLiteral optional 이 InfoWindow를 표시할 LatLng입니다. InfoWindow를 앵커와 함께 열면 앵커의 위치가 대신 사용됩니다. |
zIndex optional |
유형:
number optional 모든 InfoWindow가 zIndex 순으로 지도에 표시되며, 값이 더 높은 InfoWindow가 값이 낮은 InfoWindow 앞에 표시됩니다. 기본적으로 InfoWindow는 위도에 따라 표시되며, 위도가 낮은 InfoWindow가 위도가 높은 InfoWindow 앞에 표시됩니다. InfoWindow는 항상 마커 앞에 표시됩니다. |
InfoWindowOpenOptions 인터페이스
google.maps.InfoWindowOpenOptions
인터페이스
정보 창을 열기 위한 옵션
속성 | |
---|---|
anchor optional |
유형:
MVCObject|AdvancedMarkerElement optional 이 InfoWindow가 배치될 앵커입니다. 앵커가 null이 아니면 InfoWindow가 앵커의 상단 중앙에 배치됩니다. InfoWindow는 앵커와 동일한 지도 또는 파노라마에서 렌더링됩니다(가능한 경우). |
map optional |
유형:
Map|StreetViewPanorama optional 이 InfoWindow를 렌더링할 지도 또는 파노라마입니다. |
shouldFocus optional |
유형:
boolean optional InfoWindow가 열렸을 때 포커스를 InfoWindow 내에서 이동시켜야 하는지 여부입니다. 이 속성이 설정되지 않거나 null 또는 undefined 로 설정된 경우 휴리스틱을 사용하여 포커스를 이동해야 하는지 여부를 결정합니다. 휴리스틱은 변경될 수 있고 일부 사용 사례에는 적합하지 않을 수 있으므로 필요에 따라 이 속성을 명시적으로 설정하는 것이 좋습니다. |