JavaScript ArcGIS FeatureLayer用法及代碼示例

引用服務 URL

要從服務創建 FeatureLayer 實例，您必須將 url 屬性設置為要素服務或Map服務中圖層的 REST 端點。為了使圖層在視圖中可見，必須將其添加到視圖引用的Map中。有關向Map添加圖層的信息，請參閱Map.add()。

require(["esri/layers/FeatureLayer"], function(FeatureLayer){
  // points to the states layer in a service storing U.S. census data
  const fl = new FeatureLayer({
    url: "https://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/3"
  });
  map.add(fl);  // adds the layer to the map
});

可以從服務中的表 url 創建非空間表實例，並且必須通過調用 load() 方法加載該表。

// Add a non-spatial table.
require(["esri/layers/FeatureLayer"], function(FeatureLayer){
  // points to the non-spatial table in a service storing San Francisco crime incidents.
  const table = new FeatureLayer({
    url: "https://sampleserver6.arcgisonline.com/arcgis/rest/services/SF311/FeatureServer/1"
  });
  table.load().then(function() {
     // table is loaded. ready to be queried on the server.
  });
});

如果從不同的域請求服務，則需要 CORS enabled server 或 proxy。

引用 ArcGIS 門戶項目 ID

如果 ArcGIS Online 或 ArcGIS Enterprise 中作為項目存在，您還可以根據其 ID 創建 FeatureLayer。例如，以下代碼片段顯示如何使用 PortalItem 屬性將新的 FeatureLayer 實例添加到Map。

// points to a hosted Feature Layer in ArcGIS Online
const fl = new FeatureLayer({
  portalItem: {  // autocasts as esri/portal/PortalItem
    id: "8444e275037549c1acab02d2626daaee"
  }
});
map.add(fl);  // adds the layer to the map

以下代碼片段展示了如何使用 PortalItem 屬性創建引用表的FeatureLayer。

// points to a hosted table in ArcGIS Online
const table = new FeatureLayer({
  portalItem: { // autocasts as esri/portal/PortalItem
    id: "123f4410054b43d7a0bacc1533ceb8dc"
  }
});

// Before adding the table to the map, it must first be loaded and confirm it is the right type.
table.load().then(function() {
  if (table.isTable) {
    map.tables.add(table);
  }
});

添加一係列客戶端函數

客戶端函數也可用於創建函數層。由於 FeatureLayer 需要模式，因此在從 features 數組創建圖層時需要設置多個屬性。如果使用空間圖層，則必須使用 GeometryType 屬性以及有效的空間參考來指示要素的幾何類型(因為每個圖層僅允許一種幾何類型)。空間和非空間要素集合都需要 objectId 字段，這必須與字段對象數組一起指示，提供每個字段的架構。指定這些屬性後，必須將要素數組設置為源屬性。查看create a FeatureLayer with client-side graphics sample 以了解其實際情況。

如果在層初始化時缺少任何必需的參數，API 將嘗試從提供的參數中確定所需的參數。例如，spatialReference、geometryType、hasZ 和 hasM 屬性可以基於提供給源屬性的特征來確定。但是，如果source屬性在初始化時為空數組，則無法確定geometryType，並且該圖層將被拒絕。

FeatureLayer 初始化後，FeatureLayer 的源不會更新。如果在運行時添加、刪除或更新函數，則使用 applyEdits() 更新函數，然後使用 queryFeatures() 返回更新的函數。查看add or remove graphics from a FeatureLayer sample 以了解其實際情況。針對客戶端要素圖層和圖層視圖執行的屬性查詢中使用的屬性值區分大小寫。

const layer = new FeatureLayer({

   // create an instance of esri/layers/support/Field for each field object
   fields: [
   {
     name: "ObjectID",
     alias: "ObjectID",
     type: "oid"
   }, {
     name: "type",
     alias: "Type",
     type: "string"
   }, {
     name: "place",
     alias: "Place",
     type: "string"
   }],
   objectIdField: "ObjectID", // inferred from fields array if not specified
   geometryType: "point", // geometryType and spatialReference are inferred from the first feature
                          // in the source array if they are not specified.
   spatialReference: { wkid: 4326 },
   source: graphics,  //  an array of graphics with geometry and attributes
                     // popupTemplate and symbol are not required in each feature
                     // since those are handled with the popupTemplate and
                     // renderer properties of the layer
   popupTemplate: pTemplate,
   // a default simple renderer will be applied if not set.
   renderer: uvRenderer  // UniqueValueRenderer based on `type` attribute
});
map.add(layer);

// returns all the graphics from the layer view
view.whenLayerView(layer).then(function(layerView){
  layerView.watch("updating", function(val){
    if(!val){  // wait for the layer view to finish updating
      layerView.queryFeatures().then(function(results){
        console.log(results);  // prints all the client-side features to the console
      });
    }
  });
});

從 FeatureLayerView 上的查詢訪問特征時，請注意，特征按視圖中顯示的方式返回，包括可能已應用於特征以增強性能的任何概括。要獲取全分辨率的要素幾何圖形，請在要素圖層上使用queryFeatures()方法。

FeatureLayer 類中的查詢方法直接從服務查詢要素。例如，以下代碼片段返回服務中的所有函數，而不僅僅是 FeatureLayerView 中繪製的函數。

// Queries for all the features in the service (not the graphics in the view)
layer.queryFeatures().then(function(results){
  // prints an array of all the features in the service to the console
  console.log(results.features);
});

有關如何為特定圖層創建LayerView 的信息，請參閱View.whenLayerView()。

使用上麵提到的FeatureLayer 渲染器和查詢函數，您可以創建動態的交互式數據探索應用程序。

FeatureLayers 也支持 highlight 。當用戶單擊或點擊函數以查看彈出窗口時，默認情況下會啟用此函數。您還可以在FeatureLayerView 上調用highlight() 方法以突出顯示其他工作流中的函數，例如顯示查詢/選擇結果和突出顯示pointer-move 事件的函數。