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; } } }

Comece com ArcGIS JavaScript - DKK Geocoder

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>

<\/P>

DKK Geocoder<\/H1><\/P>Em outubro de 2019, a Esri Nederland<\/STRONG> lançou um novo serviço para busca de parcelas cadastrais: o DKK Geocoder<\/A>. DKK significa Digitale Kadastrale Kaart.<\/P>
<\/P>
Neste exercício, usamos este novo Locator na
ArcGIS API for JavaScript<\/A>, versão 4.13 (que também foi lançada em outubro de 2019).<\/P>
<\/P>
Então, se você usar a função de busca neste aplicativo web mapping, poderá pesquisar não apenas por endereços, mas também por parcelas cadastrais na Holanda: <\/P>
Começando com ArcGIS JavaScript - DKK Geocoder<\/A> <\/P>
<\/P>
Mais informações sobre este novo serviço da Esri Nederland podem ser encontradas neste blog
https:\/\/community.esri.com\/community\/arcgis-content-esri-nederland\/blog\/2019\/10\/03\/douze-points-voor-perceel-rtd06-s-4403-onze-nieuwe-dkk-geocoder<\/A> de Jeske van der Velden<\u200c><\u200c><\u200c><\u200c><\u200c><\u200c>\u200c<\u200c>\u200c<\u200c>\u200c<\u200c>\u200c<\u200c>\u200c>\u200c>\u200c>\u200c>\u200c>\u200c>\u200c>\u200c>\u200c>\u200c>\u200c>\u200c>\u200c>\u200c>\u200c>\u200c>\u200c>Outros exercícios nesta série com o Search Widget:
Locator: Buscar endereço<\/<A>
FeatureLayer: Buscar Feature<\/<A>
sources: Múltiplas fontes de busca<\/<A>
O código-fonte deste
app<\/<A> está abaixo:
<!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 - DKK Geocoder</title> <link rel= "stylesheet" href= "https:\/ \/js.arcgis.com \/4.13 \/esri \/css \/main.css"> <script src= "https:\/ \/js.arcgis.com \/4.13"></script> </head> <style> html, body { padding: 0; margin: 0; height: 100%; width: 100%; font-family: sans-serif; } #header { width: 100%; height: 70px; background-color: #113395; color:#FFFFFF; margin: 0; } #headertext { float: left; font-size: 35px; color: white; line-height: 70px; padding-left: 15px; } #viewDiv { position: absolute; top: 70px; bottom: 0; right: 0;<\/SPAN> left<\/SPAN>:<\/SPAN> 0;<\/SPAN> padding<\/SPAN>:<\/SPAN> 0;<\/SPAN> margin<\/SPAN>:<\/SPAN> 0;<\/SPAN> }<\/SPAN> td<\/SPAN> {<\/SPAN> padding<\/SPAN>:<\/SPAN> 15px;<\/SPAN> }<\/SPAN> .dialogDiv<\/SPAN> {<\/SPAN> background-color<\/SPAN>:<\/SPAN> branco;<\/SPAN> width<\/SPAN>:<\/SPAN> 480px;<\/SPAN> }<\/SPAN> .dialogHeader<\/SPAN> {<\/SPAN> color<\/SPAN>:<\/SPAN> branco;<\/SPAN> font-weight<\/SPAN>:<\/SPAN> bolder;<\/SPAN> width<\/SPAN>:<\/SPAN> auto;<\/SPAN> background-color<\/PAN>: #113395; padding: 5px; } .esri-basemap-gallery__item-thumbnail { width: auto; } </style></style> <script> require([ "esri/Map", "esri/widgets/Zoom", "esri/widgets/Home", "esri/widgets/Compass", "esri/geometry/Point", "esri/views/MapView", "esri/layers/WMTSLayer", "esri/widgets/Search", "esri/tasks/Locator", "esri/Basemap", "esri/widgets/BasemapGallery", "esri/widgets/BasemapGallery/support/LocalBasemapsSource", "esri/widgets/Expand", "esri/widgets/LayerList", "esri/layers/MapImageLayer", "dojo/domReady!" ], function(Map, Zoom, Home, Compass, Point, MapView, WMTSLayer, Search, Locator, Basemap, BasemapGallery, LocalBasemapsSource, Expand, LayerList, MapImageLayer) { document.getElementById("aboutDiv").style.display = "block"; // BRT Achtergrondkaart van PDOK als achtergrondkaart let brtachtergrondkaart = new Basemap({ baseLayers: [ new WMTSLayer({ url: "https://geodata.nationaalgeoregister.nl/tiles/service/wmts?request=GetCapabilities&service=WMTS", copyright: "<a target='_top' href='https://www.pdok.nl/introductie/-/article/basisregistratie-topografie-achtergrondkaarten-brt-a-'>BRT Achtergrondkaart</a> van <a target='_top' href='https://www.pdok.nl'>PDOK</a>", activeLayer: { id: "brtachtergrondkaart" } }) ], title: "BRT Achtergrondkaart (PDOK)", id: "brtachtergrondkaart_pdok", thumbnailUrl: "images/map.jpg" }); // Basiskaarten Esr Nederland let lightGrayCanvas_RD_EsriNL = new Basemap({portalItem: {id: "9ff6521e85d24df1aa9cd4aebfef748b"}}); //Lichtgrijze Canvas RD let darkGrayCanvas_RD_EsriNL = new Basemap({portalItem: {id: "62a3befb579e4d9f9c5c51576c8a7c25"}}); //Donkergrijze Canvas RD let topo_RD_EsriNL = new Basemap({portalItem: {id: "7aea6fa913a94176a1074edb40690318"}}); //Topo RD let open_Topo_RD_EsriNL = new Basemap({portalItem: {id: "0698b71eb7cf47898086d072e574ac32"}}); //Open Topo RD let stratenkaart_RD_EsriNL = new Basemap({portalItem: {id: "9fe1a753955f418fa1cbaf1c47610a47"}}); //Stratenkaart RD let luchtfoto_RD_EsriNL = new Basemap({portalItem: {id: "38e1a1c6ee2c421290622400d22ecf57"}}); //Luchtfoto RD let dutchBasemaps = new LocalBasemapsSource({ basemaps : [brtachtergrondkaart, topo_RD_EsriNL, open_Topo_RD_EsriNL, stratenkaart_RD_EsriNL, luchtfoto_RD_EsriNL, lightGrayCanvas_RD_EsriNL, darkGrayCanvas_RD_EsriNL] }); let map = new Map({ basemap: topo_RD_EsriNL }); let parcels = new MapImageLayer({ url: "https://basisregistraties.arcgisonline.nl/arcgis/rest/services/DKK/DKK/MapServer", title: "Digitale Kadastrale Kaart", sublayers: [{ id: 5, title: "Perceel", popupTemplate: { title: "Perceel {kadastraleaanduiding}",  content:[ { type: "fields", fieldInfos: [ { fieldName: "kadastralegemeente", label: "Kadastrale gemeente" }, { fieldName: "sectie", label: "Sectie" }, { fieldName: "perceelnummer", label: "Perceelnummer", format: { digitSeparator: false } }, { fieldName: "oppervlak", label: "Kadastrale oppervlakte (in m2)", format: { digitSeparator: true, places: 0 } } ] } ] }}, { id: 0, title: "Perceelnummer" } ] }); mape.add(parcels); 't let view = new MapView({ 't spatialReference': 28992, 't container': 'viewDiv', 't map': map, 't center': new Point({x': 155000,' y': 463000,' spatialReference': 28992}), 't zoom': 3 't });' 't view.ui.components = [ 'attribution' ];' 't let aboutDlg = document.getElementById('aboutDiv');' 't let aboutExpand = new Expand({'t expandIconClass': 'esri-icon-lightbulb','t expandTooltip': 'Sobre este aplicativo','t view': view,'t expanded': true,'t content': aboutDlg,'t group': 'top-left''t });' 't let searchWidget = new Search({'t view': view,'t allPlaceholder': 'Endereço ou Perceito Cadastral','t includeDefaultSources': false't });' 't searchWidget.sources = [{'t locator': new Locator({ url': 'https://services.arcgisonline.nl/arcgis/rest/services/Geocoder_BAG_RD/GeocodeServer'}), // BAG GeocodeServer da Esri Nederland't singleLineFieldName': 'SingleLine', // Esta opção permite pesquisar por combinação de código postal/número da casa, por exemplo: 4181 AE 38't name': 'Endereço na Holanda','t placeholder': 'Buscar endereço''t },{'t locator': new Locator({ url': 'https://geocoder.arcgisonline.nl/arcgis/rest/services/Geocoder_DKK/GeocodeServer'}), // DKK GeocodeServer da Esri Nederland't singleLineFieldName': 'SingleLine','t name': 'Perceitos Cadastrais na Holanda','t placeholder': 'Buscar perceito cadastral (por exemplo RTD06 S 4403)''t }]'t 't searchWidgetExpand = new Expand({'t expandIconClass': 'esri-icon-search','t expandTooltip': searchWidget.label,'t view': view,'t content': searchWidget,'t group': 'top-left''t });' 't let basemapGallery = new BasemapGallery({view': view,' source': dutchBasemaps});' 't basemapGalleryExpand = new Expand({'t expandIconClass': 'esri-icon-basemap', \/\/ veja https:\/\/developers.arcgis.com\/javascript\/latest\/guide\/esri-icon-font\/ expandTooltip: basemapGallery.label, view: view, content: basemapGallery, group: "top-left" }); let layerList = new LayerList({ view: view, listItemCreatedFunction: function(event){ const item = event.item; item.actionsSections = [ [ { title: item.layer.title, className: "esri-icon-description", id: "information" } ] ]; } }); layerList.on("trigger-action", function(event) { if (event.action.id === "information") { \/\/ Se a ação de informação for acionada, então abra a página de detalhes do item da camada de serviço. window.open(event.item.layer.url); } }); layerListExpand = new Expand({ expandIconClass: "esri-icon-layers", expandTooltip: layerList.label, view: view, content: layerList, group: "top-left" }); let zoom = new Zoom({view: view}); let homeWidget = new Home({view: view}); let compass = new Compass({view: view}); view.ui.add([aboutExpand, searchWidgetExpand, zoom, homeWidget, compass, basemapGalleryExpand, layerListExpand], "top-left"); \/\/ Certifique-se de que o parcelamento clicado esteja destacado - código fornecido por Robert Scheitlin, GISP no GeoNet view.popup.watch('selectedFeature', function(gra){ if(gra){ view.graphics.removeAll(); let h = view.highlightOptions; gra.symbol = { type: "simple-fill", \/\/ autocasts as new SimpleFillSymbol() color: [h.color.r,h.color.g, h.color.b, h.fillOpacity], outline: { \/\/ autocasts as new SimpleLineSymbol() color: [h.color.r,h.color.g, h.color.b, h.color.a], width: 1 } }; view.graphics.add(gra); }else{ view.graphics.removeAll(); } }); view.popup.watch('visible', function(vis){ if(!vis){ view.graphics.removeAll(); } }); }); <\/<\/SPAN>script<\/SPAN>><\/<\/SPAN><\/SPAN> <\/<\/SPAN>head<\/SPAN>><\/<\/SPAN><\/SPAN> <<\/SPAN>body<\/SPAN>><\/<\/SPAN><\/SPAN> <<\/SPAN>div<\/SPAN> id<\/SPAN>=<\/SPAN>"<\/SPAN>header"<\/SPAN><\/SPAN>><\/<\/SPAN><\/SPAN> <<\/Span>div<\/Span> id<\/Span>=<\/Span>"<\/Span>headertext"<\/Span>class<\/Span>=<\/Span>"<\/Span>stretch"<\/Span>><\/<\/span>Kadastrale Percelen in Nederland<\/<\/span>div><\/<\/ <\/div><\/<\/ <div id=<\/ class="punctuation token"><\/p<\/SPAN>><\/SPAN><\/SPAN> <<\/p<\/SPAN>><\/SPAN><\/SPAN><<\/div<\/SPAN> class<\/SPAN>=<\/"<\/esri-widget--button"<\/<\/SPAN>><\/SPAN><\/SPAN><<\/span<\/SPAN> title<\/SPAN>=<\/"<\/Clique no botão de busca ao lado e procure por um lote, por exemplo RTD06 S 4403."<\/<\/SPAN> class<\/SPAN>=<\/"<\/esri-icon-search"<\/<\/SPAN>><\/SPAN><\/SPAN><\/<\/span><\/span>

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.