|
BLOG
|
Hoi Jeske van der Velden, Dit is een mooie nieuwe service 🙂 Ik heb meteen geprobeerd of ik hem kan gebruiken in de ArcGIS API for JavaScript 4.13. en: Ja, dat kan! Voor meer informatie, zie mijn blogpost op GeoNet: https://community.esri.com/people/EPolle_TensingInternational/blog/2019/10/17/aan-de-slag-met-arcgis-javascript-dkk-geocoder En dit is de link naar de app die ik gebouwd heb: Kadastrale Percelen in Nederland Groet, Egge-Jan
... View more
10-17-2019
07:45 AM
|
1
|
0
|
4332
|
|
BLOG
|
https://community.esri.com/people/EPolle_TensingInternational/blog/2019/06/02/aan-de-slag-met-arcgis-javascript-inleiding DKK Geocoder In oktober 2019 heeft Esri Nederland een nieuwe service gelanceerd voor het zoeken naar kadastrale percelen: de DKK Geocoder. DKK staat voor Digitale Kadastrale Kaart. In deze oefening gebruiken we deze nieuwe Locator in de ArcGIS API for JavaScript, versie 4.13 (die ook nu in oktober 2019 is vrijgegeven). Dus als je de zoekfunctie in deze web mapping applicatie gebruikt, dan kun je niet alleen op adressen zoeken, maar ook op kadastrale percelen in Nederland: Aan de slag met ArcGIS JavaScript - DKK Geocoder Meer informatie over deze nieuwe dienst van Esri Nederland is te vinden in deze 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 van Jeske van der Velden Andere oefeningen in deze reeks met de Search Widget: Locator: Adres zoeken FeatureLayer: Feature zoeken sources: Meerdere zoekbronnen De broncode van deze app staat hieronder: <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Aan de slag met 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>
<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;
left: 0;
padding: 0;
margin: 0;
}
td {
padding: 15px;
}
.dialogDiv {
background-color: white;
width: 480px;
}
.dialogHeader {
color: white;
font-weight: bolder;
width: auto;
background-color: #113395;
padding: 5px;
}
.esri-basemap-gallery__item-thumbnail {
width: auto;
}
</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: "Perceelnummer: {perceelnummer}<br>Sectie: {sectie}<br>Kadastrale gemeente: {kadastralegemeente}<br>Kaastrale oppervlakte: {oppervlak} m2" -->
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"
}
]
});
map.add(parcels);
let view = new MapView({
spatialReference: 28992,
container: "viewDiv",
map: map,
center: new Point({x: 155000, y: 463000, spatialReference: 28992}),
zoom: 3
});
view.ui.components = [ "attribution" ];
let aboutDlg = document.getElementById("aboutDiv");
let aboutExpand = new Expand({
expandIconClass: "esri-icon-lightbulb",
expandTooltip: "Over deze applicatie",
view: view,
expanded: true,
content: aboutDlg,
group: "top-left"
});
let searchWidget = new Search({
view: view,
allPlaceholder: "Adres of Kadastraal perceel",
includeDefaultSources: false
});
searchWidget.sources = [{
locator: new Locator({ url: "https://services.arcgisonline.nl/arcgis/rest/services/Geocoder_BAG_RD/GeocodeServer"}), // BAG GeocodeServer van Esri Nederland
singleLineFieldName: "SingleLine", // Deze optie zorgt er voor dat je kunt zoeken op postcode/huisnummer combinatie, bijvoorbeeld: 4181 AE 38
name: "Adres in Nederland",
placeholder: "Zoek adres"
},{
locator: new Locator({ url: "https://geocoder.arcgisonline.nl/arcgis/rest/services/Geocoder_DKK/GeocodeServer"}), // DKK GeocodeServer van Esri Nederland
singleLineFieldName: "SingleLine",
name: "Kadastrale percelen in Nederland",
placeholder: "Zoek kadastraal perceel (bijvoorbeeld RTD06 S 4403)"
}]
searchWidgetExpand = new Expand({
expandIconClass: "esri-icon-search",
expandTooltip: searchWidget.label,
view: view,
content: searchWidget,
group: "top-left"
});
let basemapGallery = new BasemapGallery({view: view, source: dutchBasemaps});
basemapGalleryExpand = new Expand({
expandIconClass: "esri-icon-basemap", // see 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") {
// If the information action is triggered, then open the item details page of the service layer.
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");
// Make sure the clicked parcel is highlighted - code sample provided by Robert Scheitlin, GISP on 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();
}
});
});
</script>
</head>
<body>
<div id="header">
<div id="headertext" class="stretch">Kadastrale Percelen in Nederland</div>
</div>
<div id="viewDiv"></div>
<div class="dialogDiv" id="aboutDiv" style="display:none">
<div class="dialogHeader">Percelen Zoeken</div>
<table>
<tr>
<td>
<h3>DKK Geocoder</h3>
<p>In oktober 2019 heeft <b>Esri Nederland</b> een nieuwe service gelanceerd voor het zoeken naar kadastrale percelen: de <a href="https://www.arcgis.com/home/item.html?id=6d81906aa15243e19e1bde4cd4bff69d" target="blank">DKK Geocoder</a>.</p>
<p>Meer informatie over DKK Geocoder is te vinden in <a href="https://community.esri.com/community/arcgis-content-esri-nederland/blog/2019/10/03/douze-points-voor-perceel-rtd06-s-4403-onze-nieuwe-dkk-geocoder" target="blank">deze blog</a>.</p>
<h3>Uitproberen</h3>
<p>Hier kun je deze nieuwe zoekservice uitproberen:</p>
<p><div class="esri-widget--button"><span title="Klik op de zoekbutton hiernaast en zoek naar een perceel, bijvoorbeeld RTD06 S 4403." class="esri-icon-search"></span></div>Klik op de zoekbutton hiernaast en zoek naar een perceel, bijvoorbeeld <b>RTD06 S 4403</b>.</p>
<p>Deze applicatie is samengesteld door:<br><a href="https://www.tensing.com/" target="blank">Tensing GIS Consultancy B.V.</a></p>
</td>
</tr>
</table>
</div>
</body>
</html>
... View more
10-17-2019
07:16 AM
|
1
|
0
|
872
|
|
POST
|
feature layer| Definition - Esri Support GIS Dictionary
... View more
09-18-2019
07:42 AM
|
1
|
1
|
4064
|
|
POST
|
Hi Devendra Khatri, You might have a look in the Living Atlas of the World | ArcGIS. Maybe you will find some feature layers there suitable for your testing purposes. Cheers, Egge-Jan
... View more
09-17-2019
12:22 AM
|
0
|
0
|
895
|
|
POST
|
Hi Chris Buckmaster, I guess this known limitation is due to the fact that the version 4.x of the API does not support WFS yet. As soon as the API does support WFS, it will also support web maps with WFS layers in it, I suppose. Esri says it's "Coming soon" - we'll just have to wait (love don't come easy) Egge-Jan
... View more
09-16-2019
09:12 AM
|
0
|
0
|
1435
|
|
POST
|
Hi Chris Buckmaster, WFS Layers are supported by the ArcGIS API for JavaScript. See this sample demonstrating how to work with WFS layers in a web map: WFS Layer | ArcGIS API for JavaScript 3.29 Version 4.x of the API will also support this feature anytime 'soon': Choose between version 3.x and 4.x | ArcGIS API for JavaScript 4.12 HTH, Egge-Jan
... View more
09-16-2019
04:06 AM
|
0
|
2
|
1435
|
|
POST
|
Hi Christian Pagel, Can you please tell us a little bit more about what you want to accomplish? By default, in jsapi 3.x (and also in jsapi 4.x) the attribution is positioned at the bottom of the map, see e.g. this simple sample: ArcGIS API for JavaScript Sandbox HTH, Egge-Jan
... View more
09-12-2019
02:58 AM
|
0
|
0
|
1467
|
|
POST
|
Hi ADEC ADEC, To get your map displayed you should not use print(map) but simply map instead - see screen capture below. HTH, Egge-Jan
... View more
09-12-2019
01:00 AM
|
0
|
0
|
897
|
|
POST
|
Hi Jesus Montalvo, Please see definitions below from the Esri Support GIS Dictionary: feature class| Definition - Esri Support GIS Dictionary layer| Definition - Esri Support GIS Dictionary shapefile| Definition - Esri Support GIS Dictionary Cheers, Egge-Jan
... View more
09-11-2019
02:58 AM
|
3
|
0
|
50263
|
|
POST
|
Did you set the connectivity and elevation policies? Connectivity in the ArcGIS Network Analyst extension begins with the definition of connectivity groups. Each edge source is assigned to exactly one connectivity group, and each junction source can be assigned to one or more connectivity groups. A connectivity group can contain any number of sources. How network elements connect depends on which connectivity groups the elements are in. For example, two edges created from two distinct source feature classes can connect if they are in the same connectivity group. If they are in separate connectivity groups, the edges won't connect unless they are joined by a junction that participates in both connectivity groups. Exercise 2: Creating a multimodal network dataset—Help | ArcGIS Desktop
... View more
09-11-2019
02:47 AM
|
0
|
3
|
3933
|
|
POST
|
Hi Suraj Jha, Can you please tell us a little bit more about the configuration of your Search widget? Are you searching a Feature Layer? Which fields? You might have a look at this code sample for inspiration: Search widget with multiple sources | ArcGIS API for JavaScript 4.12 I hope you will manage to get it working after some additional research. Cheers, Egge-Jan
... View more
09-04-2019
06:10 AM
|
1
|
2
|
1202
|
|
POST
|
Hi Shari Rankin, It should not be too difficult to replicate your Manifold script to Generate Elliptical Buffers in Python. To create an ellipse using ArcPy (Python) you could have a look at Table To Ellipse—Data Management toolbox | ArcGIS Desktop. It Creates a new feature class containing geodetic ellipse features constructed based on the values in an x-coordinate field, y-coordinate field, major-axis field, minor-axis field, and azimuth field of a table. HTH, Egge-Jan
... View more
09-04-2019
05:40 AM
|
1
|
2
|
3015
|
|
POST
|
Hi z xz, If your issue has been solved, you may mark my answer as correct. In this way it will be clear to others - who may have the same question - that your question has been answered correctly. Cheers, Egge-Jan
... View more
08-26-2019
02:31 AM
|
0
|
0
|
2390
|
|
POST
|
Yeah, that's what I thought: if you concatenate the three values Party/State/County, then every county should get a unique color. So, I supposed that you wanted to visualize either the party or the state or the county... E-J
... View more
08-23-2019
09:03 AM
|
1
|
0
|
2698
|
|
POST
|
Hi Sirish Byreddy, Isn't it just the case that you want to have 3 different renderers? One for party, one for state, one for county? In that case you will have to repeat your code three times. Please let me know what you think. Egge-Jan
... View more
08-23-2019
04:13 AM
|
0
|
1
|
2698
|
| Title | Kudos | Posted |
|---|---|---|
| 1 | 03-11-2019 08:58 AM | |
| 1 | 03-30-2020 09:03 AM | |
| 2 | 12-12-2024 03:56 AM | |
| 2 | 04-15-2024 03:25 AM | |
| 2 | 03-25-2024 02:06 PM |
| Online Status |
Offline
|
| Date Last Visited |
11-19-2025
02:25 AM
|