InfoWindow class
google.maps.InfoWindow
class
一種疊加層,看起來像泡泡,而且通常連接至標記。
這個類別會擴充 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,才能在地圖上顯示該視窗。使用者可以按一下資訊視窗上的關閉按鈕,就可以將它從地圖上移除,或者開發人員可以呼叫 close(),達到一樣的效果。 | 
| 屬性 | |
|---|---|
| isOpen | 類型:   boolean檢查 InfoWindow 是否已開啟。 | 
| 方法 | |
|---|---|
| close | close()參數:無 傳回值:無 從 DOM 結構移除這個資訊視窗,就能關閉這個資訊視窗。 | 
| focus | focus()參數:無 傳回值:無 將焦點設為這個  InfoWindow。建議搭配visible事件使用這個方法,確保InfoWindow可見,再將焦點設在該項目上。無法對未顯示的InfoWindow進行焦點設定。 | 
| getContent | getContent()參數:無 | 
| getHeaderContent | getHeaderContent()參數:無 回傳值:   string|Element|Text|null|undefined這個資訊視窗的標頭內容。詳情請參閱InfoWindowOptions.headerContent。 | 
| getHeaderDisabled | getHeaderDisabled()參數:無 傳回值:   boolean|undefined整個標題列是否已停用。詳情請參閱InfoWindowOptions.headerDisabled。 | 
| getPosition | getPosition()參數:無 傳回值:   LatLng|null|undefined這個 InfoWindow 的 LatLng 位置。 | 
| getZIndex | getZIndex()參數:無 傳回值:   number這個 InfoWindow 的 zIndex。 | 
| open | open([options, anchor])參數:   
 傳回值:無 在指定地圖上開啟這個 InfoWindow。視需要將 InfoWindow 與錨點建立關聯。在核心 API 中,唯一的錨點是 Marker 類別。不過,錨點可以是任何公開 LatLng  position屬性的 MVCObject,也可以選擇性公開 PointanchorPoint屬性,用於計算pixelOffset(請參閱 InfoWindowOptions)。anchorPoint是從錨定位置到 InfoWindow 尖端的位移值。建議您使用InfoWindowOpenOptions介面做為這個方法的單一引數。如要避免在開啟時變更瀏覽器焦點,請將InfoWindowOpenOptions.shouldFocus設為false。 | 
| setContent | setContent([content])傳回值:無 | 
| setHeaderContent | setHeaderContent([headerContent])參數:   
 傳回值:無 | 
| setHeaderDisabled | setHeaderDisabled([headerDisabled])參數:   
 傳回值:無 | 
| 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()引數:無 按一下 content 屬性時,會引發此事件。 | 
| domready | function()引數:無 當包含  InfoWindow內容的<div>附加至 DOM 時,系統會觸發這個事件。如果您是以動態方式建構資訊視窗內容,您可能希望能監控這個事件。 | 
| headercontent_changed | function()引數:無 當 headerContent 屬性變更時,就會觸發這個事件。 | 
| headerdisabled_changed | function()引數:無 當 headerDisabled 屬性變更時,就會觸發這個事件。 | 
| position_changed | function()引數:無 當 position 屬性變更後,會引發此事件。 | 
| visible | function()引數:無 當  InfoWindow完全顯示時,系統會觸發這個事件。如果InfoWindow移出畫面後再移回,系統不會觸發這個事件。 | 
| zindex_changed | function()引數:無 當  InfoWindow的 zIndex 變更時,就會觸發這個事件。 | 
InfoWindowOptions 介面
google.maps.InfoWindowOptions
介面
InfoWindowOptions 物件,用於定義可在 InfoWindow 上設定的屬性。
| 屬性 | |
|---|---|
| ariaLabel optional | 類型:   string optional要指派給 InfoWindow 的 AriaLabel。 | 
| content optional | 要在 InfoWindow 中顯示的內容。可以是 HTML 元素、純文字字串或包含 HTML 的字串。InfoWindow 的大小會根據內容調整。如果要另外設定內容的大小,可以將內容設定成該大小的 HTML 元素。 | 
| disableAutoPan optional | 類型:   boolean optional預設值:  false停用平移地圖功能,讓資訊視窗開啟時完全顯示。 | 
| headerContent optional | 要在 InfoWindow 標題列中顯示的內容。可以是 HTML 元素或純文字字串。InfoWindow 的大小會根據內容調整。如要為標題內容設定明確大小,請將 headerContent 設為具有該大小的 HTML 元素。 | 
| headerDisabled optional | 類型:   boolean optional停用資訊視窗中的整個標題列。設為 true 時,系統會移除標題,隱藏標題內容和關閉按鈕。 | 
| maxWidth optional | 類型:   number optional資訊視窗的最大寬度,不受內容寬度影響。只有在呼叫  open()之前設定這個值,系統才會考量此值。如要在變更內容時變更最大寬度,請呼叫close()、setOptions(),然後呼叫open()。 | 
| minWidth optional | 類型:   number optional資訊視窗的最小寬度,不論內容寬度為何。使用這項屬性時,強烈建議將  minWidth設為小於地圖寬度 (以像素為單位) 的值。只有在呼叫open()之前設定這個值,系統才會考量此值。如要在變更內容時變更最小寬度,請依序呼叫close()、setOptions()和open()。 | 
| pixelOffset optional | 類型:   Size optional資訊視窗尖端與地圖上資訊視窗錨定點的位移值 (以像素為單位)。如果使用錨點開啟 InfoWindow,系統會根據錨點的  anchorPoint屬性計算pixelOffset。 | 
| position optional | 類型:   LatLng|LatLngLiteral optional要顯示這個 InfoWindow 的 LatLng。如果 InfoWindow 是透過錨點開啟,系統會改用錨點的位置。 | 
| zIndex optional | 類型:   number optional所有資訊視窗都會按照 zIndex 顯示在地圖上,值較高的資訊視窗會比值較低的資訊視窗優先顯示。根據預設,資訊視窗會依緯度顯示,緯度較低的資訊視窗會顯示在緯度較高的資訊視窗前方。資訊視窗會顯示在標記的前面。 | 
InfoWindowOpenOptions interface
google.maps.InfoWindowOpenOptions
介面
開啟資訊視窗的選項
| 屬性 | |
|---|---|
| anchor optional | 類型:   MVCObject|AdvancedMarkerElement optional這個資訊視窗的錨定位置。如果錨點不是空值,InfoWindow 會位於錨點的頂端中央。InfoWindow 會在與錨點相同的地圖或全景上算繪 (如適用)。 | 
| map optional | 類型:   Map|StreetViewPanorama optional要顯示這個 InfoWindow 的地圖或全景。 | 
| shouldFocus optional | 類型:   boolean optional是否要在開啟 InfoWindow 時,將焦點移入 InfoWindow。如果未設定這項屬性,或將其設為  null或undefined,系統會使用啟發式方法判斷是否應移動焦點。建議您明確設定此屬性以符合需求,因為啟發式方法可能會變更,且不一定適用於所有用途。 |