nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Começando com ArcGIS JavaScript - Adicionar FeatureLayer

Egge-Jan_Pollé

<\/HEAD>

<\/A>https:\/\/community.esri.com\/people\/EPolle_TensingInternational\/blog\/2019\/06\/02\/aan-de-slag-met-arcgis-javascript-inleiding<\/A><\/P>

<\/H2>FeatureLayer<\/H2><\/P>A Esri Nederland publicou uma Feature Layer com municípios holandeses (para o ano de 2019)<\/A> via ArcGIS Online.<\/P>

<\/P>

Esta camada será adicionada como um

FeatureLayer <\/A> à nossa aplicação web.<\/P>

<\/P>

Em seguida, ajustamos o estilo da camada aplicando um renderer<\/SPAN>. E definimos um popupTemplate<\/SPAN> para mostrar informações sobre o município em um popup. Por fim, adicionamos um widget

LayerList<\/A>, para que seja possível ligar e desligar a camada.<\/P>

<\/P>

O código completo está abaixo.

Clique aqui para ver o resultado final em funcionamento<\/A>.<\/P>

<\/P>

<!DOCTYPE html><\/><<\/>html<\/>><\/><\/><<\/>head<\/>><\/><\/>  <meta charset=\"utf-8\"><\/>  <meta name=\"viewport\" content=\"initial-scale=1, maximum-scale=1, user-scalable=no\"><\/>  <title>Começando com ArcGIS JavaScript - Adicionar FeatureLayer</title><\/>  <style>
    html, body, #viewDiv {
      padding: 0;
      margin: 0;
      height: 100%;
      width: 100%;
    }
  </style>
  <link rel=\"stylesheet\" href=\"https://js.arcgis.com/4.11/esri/css/main.css\">
  <script src=\"https://js.arcgis.com/4.11/\"></script>
  <script>
      require([
        \"esri/Map\",
        \"esri/geometry/Point\",
        \"esri/views/MapView\",
        \"esri/layers/FeatureLayer\",
        \"esri/widgets/LayerList\"
      ], function(Map, Point, MapView, FeatureLayer, LayerList) {
      var map = new Map({
        basemap: {
          portalItem: {
            id: \"7aea6fa913a94176a1074edb40690318\" // Topo RD
          }
        }
      });
      var popupTemplate = { // autocasts as new PopupTemplate()
        title: \"Município {Gemeentenaam}\",
        content: \"Código do município {GM_Code}\"
      };
      var renderer = {
        type: \"simple\",  // autocasts as new SimpleRenderer()
        symbol: {
          type: \"simple-fill\",  // autocasts as new SimpleFillSymbol()
          style: \"none\  class="punctuation token">, // O polígono não tem preenchimento
          outline: {  // autocasts como novo SimpleLineSymbol()
            width: 1.5,
            color: "#F5B041" // Código de Cor Hexadecimal
}
}
};

var nederlandseGemeentenLayer = new FeatureLayer({
        url: "https://services.arcgis.com/nSZVuSZjHpEZZbRo/arcgis/rest/services/Bestuurlijke_Grenzen_Gemeenten_2019/FeatureServer/0",
        title: "Gemeenten (2019)",
        popupTemplate: popupTemplate,
        renderer: renderer
});

      map.add(nederlandseGemeentenLayer);

var view = new MapView({
	    spatialReference: 28992, 
	    container: "viewDiv",
	    map: map,
	    center: new Point({x: 155000, y: 463000, spatialReference: 28992}),
	    zoom: 3
}");

      var layerList = new LayerList({
        view: view
      });

      view.ui.add(layerList, {
        position: "top-right"
      });
    });





<<EMOJI_0>><<EMOJI_1>><<EMOJI_2>><<EMOJI_3>><<EMOJI_4>><<EMOJI_5>><<EMOJI_6>><<EMOJI_7>><<EMOJI_8>><<EMOJI_9>><<EMOJI_10>><<EMOJI_11>><<EMOJI_12>><<EMOJI_13>><<EMOJI_14>><<EMOJI_15>><<EMOJI_16>><<EMOJI_17>><<EMOJI_18>><<EMOJI_19>><<EMOJI_20>><<EMOJI_21>><<EMOJI_22>><<EMOJI_23>><<EMOJI_24>><<EMOJI_25>><<EMOJI_26>><<EMOJI_27>><<EMOJI_28>><<EMOJI_29>><<EMOJI_30>><<EMOJI_31>><<EMOJI_32>><<EMOJI_33>
</spa

Encontre mais publicações marcadas com

Comentários

There are no comments yet

Participe da Conversa

Membros conectados podem postar, seguir atualizações e mais. Novo aqui? Registre uma conta gratuita.

Links Rápidos

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.