<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=7, IE=9, IE=10"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <title>AB Feature Layer - No Basemap</title> <link rel="stylesheet" href="http://servicesbeta.esri.com/jsapi/arcgis/3.5/js/esri/css/esri.css"> <style> html, body, #map { height: 100%; width: 100%; margin: 0; padding: 0; } </style> <script src="http://servicesbeta.esri.com/jsapi/arcgis/3.5/"></script> <script> var map; var rmFeatures, grosFeatures; require([ "dojo/dom-construct", "esri/map", "esri/graphic", "esri/layers/FeatureLayer", "esri/tasks/FeatureSet", "dojo/domReady!"], function(domConstruct) { loadJson(); //initMap(); } ); function loadJson(){ var jsonRequest = new esri.request({ url : "feature_collection_rm.json", handleAs : "json" //load : jsonLoaded, //error : jsonLoadError }); jsonRequest.then( jsonLoaded, jsonLoadError ); } function jsonLoaded(response, io){ console.log('Loaded JSON features...'); console.log(response); jsonFeatures = response.featureSet.features; parseJson(jsonFeatures); } function jsonLoadError( error, io ){ console.log('Error loading JSON features...'); } function parseJson(jsonFeatures){ console.log('Parsing JSON features...'); console.log(jsonFeatures); this.grosFeatures = []; this.rmFeatures = []; for ( i=0; i<jsonFeatures.length; i++ ) { var jsonFeature = jsonFeatures; console.log(jsonFeature.properties.objectid); var polyRings = { 'rings': jsonFeature.geometry.coordinates, 'spatialReference':{'wkid':4326}}; var polyJson = { 'geometry': polyRings, 'symbol':{ 'color':[0,0,0,64], 'outline':{'color':[0,0,0,255],'width':1,'type':'esriSLS','style':'esriSLSSolid'}, 'type':'esriSFS','style':'esriSFSSolid' }, 'attributes':{ 'objectid': i, 'id': jsonFeature.id, 'asset_type': jsonFeature.properties.AssetType } }; var graphic = new esri.Graphic( polyJson ); if ( jsonFeature.properties.AssetType === 'gros' ) { console.log('Asset type is gros...'); this.grosFeatures.push( graphic ); } else if ( jsonFeature.properties.AssetType === 'rm' ) { console.log('Asset type is rm...'); this.rmFeatures.push( graphic ); } } initMap(); } function initMap() { console.log(this.rmFeatures); console.log('Initializing map...'); // create the layer definition for the feature layer var layerDefinition = { 'geometryType': 'esriGeometryPolygon', 'fields': [ { 'name': 'id', 'type': 'esriFieldTypeString', 'alias': 'ID' }, { 'name': 'asset_type', 'type': 'esriFieldTypeString', 'alias': 'Asset Type' },{ 'name': 'objectid', 'type' : 'esriFieldTypeOID', 'alias': 'objectid' }] } // create the feature collection for the feature layer var featureCollection = { 'layerDefinition': layerDefinition, 'featureSet': { 'features': this.rmFeatures, 'geometryType': 'esriGeometryPolygon' } }; var infoTemplate = new esri.InfoTemplate("Area Asset", "${id}"); // create the feature layer var featureLayer = new esri.layers.FeatureLayer( featureCollection, { 'id': 'ab-gros-rm', 'infoTemplate': infoTemplate, 'mode': esri.layers.FeatureLayer.MODE_SNAPSHOT }); // create the map var bounds = new esri.geometry.Extent({ 'xmin': 0, 'ymin': 0, 'xmax': 10000, 'ymax': 10000 }); map = new esri.Map('map',{ 'extent': bounds }); // add the feature layer to the map map.addLayer( featureLayer ); //var fl = map.getLayer('ab-gros-fl'); //var jsonObj = featureLayer.toJson(); //console.log( JSON.stringify( jsonObj )); //map.graphics.add( graphic ); } </script> </head> <body> <div id="map"></div> </body> </html>
Angemeldete Mitglieder können Beiträge verfassen, Updates folgen und mehr. Neu hier? Registriere ein kostenloses Konto.
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.