<\/HEAD>
gray<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<title>ArcGIS JavaScript Tutorials: Ebenen zu einer Karte hinzufügen<\/title>
<style>
html, body, #viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
<\/style>
<link rel="stylesheet" href="https:\/\/js.arcgis.com\/4.15\/esri\/themes\/light\/main.css">
<script src="https:\/\/js.arcgis.com\/4.15\/"><\/script><\/P>
<\/P>
<script>
require([
"esri\/Map",
"esri\/views\/MapView",
"esri\/widgets\/BasemapToggle",
"esri\/layers\/FeatureLayer",
"esri\/layers\/MapImageLayer",
"esri\/renderers\/ClassBreaksRenderer",
& nbsp ; & nbsp ; "esri\/symbols\/SimpleMarkerSymbol",
& nbsp ; nbsp ; nbsp ; nbsp ; nbsp ; nbsp ; nbsp ; nbsp ; "esri\/layers\/GraphicsLayer",
"esri\/tasks\/support\/Query",
"esri\/tasks\/QueryTask",
"esri\/geometry\/geometryEngine"
], function(Map,MapView,BasemapToggle,FeatureLayer,MapImageLayer,ClassBreaksRenderer,SimpleMarkerSymbol,GraphicsLayer,Query,QueryTask,geometryEngine) {
var map = new Map({
basemap: "gray"
});<\/P>
<\/P>
var view = new MapView({
container: "viewDiv",
map: map,
center: [-100.000000,31.000000],
zoom: 13
});
var basemapToggle = new BasemapToggle({
view: view,
nextBasemap: "topo-vector"
});
view.ui.add(basemapToggle, "bottom-right");<\/P>
<\/P>
var featureLayer = new FeatureLayer({
url: "https:\/\/services6.arcgis.com\/cmKWjJDTp7lPppjM\/arcgis\/rest\/services\/Zip\/FeatureServer\/0"
});<\/P>
<\/P>
map.add(featureLayer);
featureLayer.when(function(){
view.extent=featureLayer.fullExtent;
});
var medianAgeLayer = new MapImageLayer({
url: "https:\/\/demographics9.arcgis.com\/arcgis\/rest\/services\/USA_Demographics_and_Boundaries_2019\/MapServer"
});<\/P>
<\/P>
var cbrenderer = new ClassBreaksRenderer({
field: "Age"
});<\/P>
<\/P>
cbrenderer.addClassBreakInfo({
minValue: 19,
maxValue: 40,
symbol: new SimpleMarkerSymbol({
style: "diamond",
color: "#9ACD32",
size: 10
})
});<\/P>
<\/P>
cbrenderer.addClassBreakInfo({
minValue: 41,
maxValue: 52,
symbol: new SimpleMarkerSymbol({
style: "diamond",
color: [0,0,255,0.2],
size: 15
})
});
featureLayer.renderer = cbrenderer;
< BR \/> var graphicsLayer = new GraphicsLayer({< BR \/> graphics: [] < BR \/> }); < BR \/> map.add(graphicsLayer); < BR \/> < BR \/> var gCriteria01Geometry;< BR \/> var gCriteria02Geometry;< BR \/> < BR \/> function countPerZIPCode(inputLayer){ < BR \/> var q = featureLayer.createQuery(); < BR \/> q.outFields = ["ZIP"]; < BR \/> return inputLayer.queryFeatures(q).then(function(response){ < BR \/> var dict = {}; < BR \/> var zip;< BR \/> response.features.forEach(function (item) { < BR \/> zip = item.attributes.ZIP;< BR \/> if (dict[zip] == undefined) { < BR \/> dict[zip]= 1;< BR \/> } < BR \/> else < BR \/> { < BR \/> dict[zip] = dict[zip] + 1;< BR \/> } < BR \/> }); < BR \/> return Object.keys(dict).reduce(function(key1,key2){ < BR \/> return dict[key1] > dict[key2] ? key1 : key2;< BR \/> }); < BR \/> }); < BR \/> } < BR \/> < BR \/> function bufferByDistance(sickestZIP){ < BR \/> var q = new Query(); < BR \/> q.where = "ID = '" + sickestZIP + "'";< BR \/> q.returnGeometry = true;< BR \/> var medianAgeQueryTask = new QueryTask({ < BR \/> url: "https:\/\/demographics9.arcgis.com\/arcgis\/rest\/services\/USA_Demographics_and_Boundaries_2019\/MapServer" < BR \/> }); < BR \/> rückgabe medianAgeQueryTask.execute(q).then(function(response){
rückgabe response.features[0].geometry;
}).then(function(sickestZIPGeometry){
gCriteria01Geometry = geometryEngine.buffer(
 sickestZIPGeometry,
&nbpspacing        2,
&nbpspacing        "miles"
&nbpspacing      );
&nbpspacingdisplayMyPolygon(gCriteria01Geometry, "rot");
&nbpspacingdisplayMyPolygon(sickestZIPGeometry, "grün");
&nbpspacing});
&nbpspacing}&nbpspacing
&nbpspacing
&nbpspacingview.when(featureLayer.when()
&nbpspacing.then(countPerZIPCode)
&nbpspacing.then(bufferByDistance)
);
&nbpspacing
});
<\/script>
<\/head>
<body>
&nbpspacing<div id="viewDiv"></div>
</body>
</html><\/P><\/BODY><\/HTML>