當前位置: 首頁>>代碼示例 >>用法及示例精選 >>正文

JavaScript ArcGIS PopupTemplate.actions用法及代碼示例


基本信息

以下是所在類或對象的基本信息。

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.actions函數(或屬性)的定義如下：

來自 Object[]

A Collection的行動或者動作切換對象。每個對象代表一個動作或函數，可以通過單擊圖標或圖像來執行彈出窗口.默認情況下，每個彈出窗口有一個zoom-to帶有放大鏡圖標的動作popupTemplate-zoom-action.單擊此圖標時，視圖會放大四個 LOD 並以所選要素為中心。

PopupTemplates 沒有默認操作。要使用 PopupTemplate 覆蓋 Popup 上的操作，請參閱 overwriteActions。 PopupTemplate 中定義的操作隻會出現在應用該特定 PopupTemplate 的要素或圖層的 Popup 中。

彈出窗口中每個動作的順序與它們在動作 Collection 中出現的順序相同。

每次單擊彈出窗口中的操作時，都會觸發 Popup 中的 Popup 事件。此事件應用於為每個單擊的操作執行自定義代碼。例如，如果您想將 zoom-out 動作添加到 PopupTemplate 以將視圖縮小幾個 LOD，您可以在單獨的函數中定義 zoom-out 代碼。然後，您將在 trigger-action 事件處理程序中調用自定義 zoom-out 函數。有關其工作原理的更多詳細信息，請參閱下麵的示例代碼片段。

使用 ActionButton 或 ActionToggle 類中列出的屬性定義操作。

例子：

// Defines an action to zoom out from the selected feature
let zoomOutAction = {
  // This text is displayed as a tooltip
  title: "Zoom out",
  // The ID by which to reference the action in the event handler
  id: "zoom-out",
  // Sets the icon font used to style the action button
  className: "esri-icon-zoom-out-magnifying-glass"
};
// Adds the custom action to the PopupTemplate.
popupTemplate.actions.push(zoomOutAction);
// Apply this PopupTemplate to a layer (or graphic)
layer.popupTemplate = popupTemplate;
// This action will only appear in the popup for features in that layer

// The function to execute when the zoom-out action is clicked
function zoomOut() {
  // In this case the view zooms out two LODs on each click
  view.goTo({
    center: view.center,
    zoom: view.zoom - 2
  });
}

// This event fires for each click on any action
// Notice this event is handled on the default popup of the View
// NOT on an instance of PopupTemplate
view.popup.on("trigger-action", function(event){
  // If the zoom-out action is clicked, fire the zoomOut() function
  if(event.action.id === "zoom-out"){
    zoomOut();
  }
});

相關用法


注：本文由純淨天空篩選整理自arcgis.com大神的英文原創作品 PopupTemplate.actions。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。