ArcGIS API for JavaScript 不同数据Layer加载

目录

Featurelayer显示

MapImageLayer显示

TileLayer显示

ElevationLayer显示

StreamLayer显示

KMLLayer显示

CSVLayer显示

GeojsonLayer显示

---

Featurelayer显示

require([
    "esri/layers/FeatureLayer"], 
function (
    FeatureLayer) 
{               
    const layer = new FeatureLayer({
        url: "数据源",
        title:"FeatureLayer"
    });
    map.add(layer);
});

MapImageLayer显示

require([
    "esri/layers/MapImageLayer"], 
function (
    MapImageLayer) 
{               
    const raster = new MapImageLayer({
        url: "数据源",
        title:"MapImageLayer"
    });
    map.add(raster);
});

TileLayer显示

        在这里记得切片数据也需要引用MapImageLayer

require([
    "esri/Map",
    "esri/layers/TileLayer",
    "esri/layers/MapImageLayer"],
function(
    Map,
    MapImageLayer,
    TileLayer) 
{
    const tileLayer = new TileLayer({
        url: "数据源"
    });

    var map = new Map({
        basemap: "streets",
        layers:[tileLayer]
    });
});

ElevationLayer显示

        这里记得添加的是3D视图

require([
    "esri/Map",
    "esri/views/SceneView" , 
    "esri/layers/ElevationLayer"], 
function (
    Map, 
    SceneView, 
    ElevationLayer) 
{
    const map = new Map({
        basemap: "hybrid",
        ground: "world-elevation"
    });
    const view = new SceneView({
        container: "viewDiv",
        map: map,
        camera: {
            position: [-121.83, 48.279, 1346],
            heading: 300,
            tilt: 60
        }
    });
    const elevationLayer = new ElevationLayer({
        url: "https://sampleserver6.arcgisonline.com/arcgis/rest/services/OsoLandslide/OsoLandslide_After_3DTerrain/ImageServer",
        visible: true
    });
    map.ground.layers.add(elevationLayer);
});

StreamLayer显示

require([
    "esri/layers/StreamLayer"], 
function (
    StreamLayer,) 
{
    const streamLayer = new StreamLayer({
        url: "https://geoeventsample1.esri.com:6443/arcgis/rest/services/LABus/StreamServer",
        purgeOptions: {
            displayCount: 10000
        },
        maxReconnectionAttempts: 100,
        maxReconnectionInterval: 10
        }
    );
    map.add(streamLayer);
});

KMLLayer显示

require([
    "esri/layers/KMLLayer"], 
function (
    KMLLayer) 
{
    const kmllayer = new KMLLayer({
        url: "https://earthquake.usgs.gov/fdsnws/event/1/query?format=kml&minmagnitude=5.8",
        title:"全球地震数据"
    });
    map.add(kmllayer); 
});

CSVLayer显示

require([
    "esri/layers/CSVLayer"], 
function (
    CSVLayer) 
{
    const csvlayer = new CSVLayer({
        url: "https://developers.arcgis.com/javascript/latest//sample-code/layers-csv/live/earthquakes.csv",
        title:"全球地震数据",
    });
    map.add(csvlayer);  
});

GeojsonLayer显示

require([
    "esri/layers/GeoJSONLayer"], 
function (
    GeoJSONLayer) 
{
    const geojsonLayer = new GeoJSONLayer({
        url: "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.geojson",
        title:"全球地震数据",
        copyright: "USGS Earthquakes",
    });
    map.add(geojsonLayer);  // adds the layer to the map
});