Deutsch

How To: Ändern des Style einer Vektorgrundkarte mit ArcGIS API for JavaScript

Zusammenfassung

Vektorgrundkarten bieten u. a. den Vorteil, dass der Style der Grundkarten, z. B. die Farbe, mit ArcGIS API for JavaScript angepasst werden kann.

Vorgehensweise

Zum Ändern des Style von Vektorgrundkarten wird die Style-URL abgerufen und im Code angewendet.

  1. Rufen Sie die Style-URL ab. Befolgen Sie die nachstehenden Anweisungen, um den Style einer vorhandenen Vektorgrundkarte aus einem ArcGIS Online-Konto zu verwenden:
    1. Melden Sie sich bei einem ArcGIS Online-Konto an, und öffnen Sie die Seite "Elementdetails" der gewünschten Vektorgrundkarte.
    2. Zeigen Sie mit der Option Style anzeigen die Style-URL der Vektorgrundkarte an.
User-added image
  1. Kopieren Sie die Style-URL. In der folgenden Abbildung wird ein Beispiel für eine Style-URL gezeigt:
User-added image
  1. Wenden Sie die Style-URL mit dem folgenden Skript in ArcGIS API for JavaScript an.
    require(["esri/map",
        "esri/layers/FeatureLayer",
        "esri/layers/VectorTileLayer",
        "dojo/domReady!"
    ], function (Map, FeatureLayer, VectorTileLayer) {
    
        //Initializing the map constructor
        var map = new Map("map", {
            center: [-118, 34.5],
            zoom: 8,
            //basemap: "topo"
        });
    
       //Ändern Sie beim Anpassen einer Vektorgrundkarte die URL in die angepasste URL
      var darkGrayStyleURL = "https://www.arcgis.com/sharing/rest/content/items/57436c01bc754dbb87dfb636b6484022/resources/styles/root.json";
      var lightGrayStyleURL = "https://www.arcgis.com/sharing/rest/content/items/1e47168d181248e491541ffd5a91c0de/resources/styles/root.json"
    
        let vectormap = new VectorTileLayer("https://basemaps.arcgis.com/v1/arcgis/rest/services/World_Basemap/VectorTileServer");
        vectormap.setStyle(lightGrayStyleURL);
        vectormap.on("load", () => {
            map.addLayer(vectormap);
        });
    
    
    
    });

Referenzinformationen