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

基本信息

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

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

ESM: import Popup from "@arcgis/core/widgets/Popup";

類： esri/widgets/Popup

繼承: Popup > Widget > Accessor

自從：用於 JavaScript 4.0 的 ArcGIS API

用法說明

Popup.actions函數(或屬性)的定義如下：

actions Collection<(ActionButton|ActionToggle)> autocast 來自 Object []

定義可以通過單擊彈出窗口中的圖標或圖像來執行的操作。默認情況下，每個彈出窗口都有一個zoom-to帶有放大鏡圖標的動作 popupTemplate-zoom-action .單擊此圖標時，視圖會放大四個 LOD 並以所選要素為中心。

您可以通過將 includeDefaultActions 設置為 false 或在 PopupTemplate 中將 overwriteActions 屬性設置為 true 來從默認彈出操作中刪除此操作。彈出窗口中每個動作的順序是它們在數組中出現的順序。

每次單擊彈出窗口中的操作時都會觸發 trigger-action 事件。此事件應用於為每個單擊的操作執行自定義代碼。例如，如果您想向彈出窗口添加 zoom-out 操作以將視圖縮小多個 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 popup.
view.popup.actions.push(zoomOutAction);

// 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
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大神的英文原創作品 Popup.actions。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。