JavaScript ArcGIS GeoJSONLayer用法及代碼示例

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

ESM: import GeoJSONLayer from "@arcgis/core/layers/GeoJSONLayer";

類： esri/layers/GeoJSONLayer

繼承: GeoJSONLayer > Layer > Accessor

自從：用於 JavaScript 4.11 的 ArcGIS API

• Overview
• 創建GeoJSONLayer

概述

GeoJSONLayer 類用於基於 GeoJSON 創建圖層。 GeoJSON 是一種用於編碼各種地理數據結構的格式。 GeoJSON 數據必須符合 RFC 7946 specification ，其中指出坐標在 SpatialReference.WGS84 中。請參閱 FeatureLayer 的 querying your data 部分以了解有關如何查詢 geojson 數據的更多信息，並參閱 data visualization 部分以了解如何更改 GeoJSONLayer 的可視化。

請參閱下表以了解GeoJSON 中支持的幾何對象及其對應的幾何類型：

GeoJSON 幾何對象	API 幾何類型
Point	Point
MultiPoint	Multipoint
線串/多線串	Polyline
多邊形/多多邊形	Polygon

創建GeoJSONLayer

GeoJSONLayer 是通過將其 url 屬性設置為指向 geojson feed 或內存中 geojson 數據的 blob url 來創建的。

引用 geojson 提要 URL

要從 geojson feed 創建 GeoJSONLayer 實例，您必須將 url 屬性設置為 geojson feed 的 url。

require(["esri/layers/GeoJSONLayer"], function(GeoJSONLayer){
  // points to the states layer in a service storing U.S. census data
  const geojsonlayer = new GeoJSONLayer({
    url: "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.geojson",
    copyright: "USGS Earthquakes"
  });
  map.add(geojsonlayer);  // adds the layer to the map
});

通過 blob url 引用內存 geojson 數據

您還可以通過將 blob url 傳遞給圖層的 url 屬性，從內存中的 geojson 數據創建 GeoJSONLayer。以下代碼片段展示了如何從 blob url 創建新的GeoJSONLayer。

// create a geojson layer from geojson feature collection
const geojson = {
  type: "FeatureCollection",
  features: [
    {
      type: "Feature",
      id: 1,
      geometry: {
        type: "Polygon",
        coordinates: [
          [
            [100.0, 0.0],
            [101.0, 0.0],
            [101.0, 1.0],
            [100.0, 1.0],
            [100.0, 0.0]
          ]
        ]
      },
      properties: {
        prop0: "value0",
      }
    }
  ]
};

// create a new blob from geojson featurecollection
const blob = new Blob([JSON.stringify(geojson)], {
  type: "application/json"
});

// URL reference to the blob
const url = URL.createObjectURL(blob);
// create new geojson layer using the blob url
const layer = new GeoJSONLayer({
  url
});