JavaScript ArcGIS PopupTemplate用法及代碼示例

AMD: require(["esri/PopupTemplate"], (PopupTemplate) => { /* code goes here */ });

ESM: import PopupTemplate from "@arcgis/core/PopupTemplate";

類： esri/PopupTemplate

繼承: PopupTemplate > Accessor

自從：用於 JavaScript 4.0 的 ArcGIS API

PopupTemplate 為特定的 Layer 或 Graphic 格式化和定義 Popup 的內容。用戶還可以使用PopupTemplate 來訪問特征屬性的值和選擇視圖中的特征時從Arcade 表達式返回的值。

PopupTemplate 包含標題和內容屬性，用作將要素的 attributes 轉換為 HTML 表示形式的模板。語法{fieldName} 或{expression/expressionName} 執行參數替換。 Graphic 上的默認行為是在單擊 Graphic 後顯示 view's Popup 。此默認行為需要 PopupTemplate。

PopupTemplate 還允許您格式化 Number 和 Date 字段值並使用 fieldInfos 屬性覆蓋字段別名。還可以將操作添加到模板中，以使用戶能夠執行與要素相關的操作，例如縮放或基於要素的位置或屬性執行查詢。

在上圖中，初始文本在紐約結婚，郵政編碼：11358設置在標題PopupTemplate 的屬性，其中ZIP是包含郵政編碼的字段的名稱。

popupTemplate.title = "Marriage in NY, Zip Code: {ZIP}",

其餘內容在 content 屬性中定義，其中 NEVMARR_CY 、 MARRIED_CY 和 DIVORCD_CY 都是包含要在彈出窗口中使用的值的字段名稱。

popupTemplate.content = "<p>As of 2015, <b>{MARRIEDRATE}%</b> of the" +
" population in this zip code is married.</p>" +
"<ul><li>{MARRIED_CY} people are married</li>" +
"<li>{NEVMARR_CY} have never married</li>" +
"<li>{DIVORCD_CY} are divorced</li><ul>";

上麵的示例演示了如何直接使用自定義文本字符串格式化內容。這是格式化模板的一種方法，還可以在內容中添加其他元素，例如 fields 、 media 和 attachments 。這些元素可以單獨添加或組合添加。有關使用這些不同元素的更多信息可以在內容中找到。

PopupTemplates 還可能包含自定義操作。單擊時，這些操作將執行開發人員定義的自定義代碼。有關更多詳細信息，請參閱 actions 屬性。