I am using a custom widget which is used to draw an extent and retrieve the XMax,Xmin,YMax,YMin values of the used Map Service but in WAB it is returning the extent values of the basemap. Also, the spatial reference is different for both Map Service and BaseMap.
How Can I get the Map Service's extent values??
Solved! Go to Solution.
Rathmath,
If the basemap is in a different spatial reference then the one you need for that map service then you will have to re-project the extent drawn by the end user using the GeometryService.
Here is a quick simple example app:
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/> <title>Simple Map</title> <link rel="stylesheet" href="http://js.arcgis.com/3.14/esri/css/esri.css"> <style> html, body, #map { height: 100%; width: 100%; margin: 0; padding: 0; } body { background-color: #FFF; overflow: hidden; font-family: "Trebuchet MS"; } </style> <script src="http://js.arcgis.com/3.14/"></script> <script> var map, gsvc; require([ "esri/map", "esri/tasks/GeometryService", "esri/tasks/ProjectParameters", "esri/toolbars/draw", "esri/graphic", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/SpatialReference", "dojo/_base/lang", "dojo/on", "esri/symbols/SimpleFillSymbol", "dojo/domReady!" ], function( Map, GeometryService, ProjectParameters, Draw, Graphic, ArcGISDynamicMapServiceLayer, SpatialReference, lang, on, SimpleFillSymbol ) { map = new Map("map", { basemap: "topo", //For full list of pre-defined basemaps, navigate to http://arcg.is/1JVo6Wd center: [-122.45, 37.75], // longitude, latitude zoom: 13 }); gsvc = new GeometryService("http://sampleserver6.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer"); var dLayer = new ArcGISDynamicMapServiceLayer("http://sampleserver5.arcgisonline.com/arcgis/rest/services/911CallsHotspot/MapServer"); map.addLayer(dLayer); on(map, 'load', createToolbar); function createToolbar() { var toolbar = new Draw(map); toolbar.activate(Draw.EXTENT); toolbar.on("draw-end", addToMap); } function addToMap(evt) { map.graphics.clear(); evt.target.deactivate(); var graphic = new Graphic(evt.geometry, new SimpleFillSymbol()); console.info("In Geometry: ", evt.geometry.xmax, evt.geometry.xmin, evt.geometry.ymax, evt.geometry.ymin); map.graphics.add(graphic); var params = new ProjectParameters(); params.geometries = [evt.geometry]; params.outSR = new SpatialReference({wkid:102726}); gsvc.project(params, lang.hitch(this, function(geomsArr){ console.info("Out Geometry: ", geomsArr[0].xmax, geomsArr[0].xmin, geomsArr[0].ymax, geomsArr[0].ymin); })); } }); </script> </head> <body> <div id="map"></div> </body> </html>
Rathmath,
If the basemap is in a different spatial reference then the one you need for that map service then you will have to re-project the extent drawn by the end user using the GeometryService.
Here is a quick simple example app:
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/> <title>Simple Map</title> <link rel="stylesheet" href="http://js.arcgis.com/3.14/esri/css/esri.css"> <style> html, body, #map { height: 100%; width: 100%; margin: 0; padding: 0; } body { background-color: #FFF; overflow: hidden; font-family: "Trebuchet MS"; } </style> <script src="http://js.arcgis.com/3.14/"></script> <script> var map, gsvc; require([ "esri/map", "esri/tasks/GeometryService", "esri/tasks/ProjectParameters", "esri/toolbars/draw", "esri/graphic", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/SpatialReference", "dojo/_base/lang", "dojo/on", "esri/symbols/SimpleFillSymbol", "dojo/domReady!" ], function( Map, GeometryService, ProjectParameters, Draw, Graphic, ArcGISDynamicMapServiceLayer, SpatialReference, lang, on, SimpleFillSymbol ) { map = new Map("map", { basemap: "topo", //For full list of pre-defined basemaps, navigate to http://arcg.is/1JVo6Wd center: [-122.45, 37.75], // longitude, latitude zoom: 13 }); gsvc = new GeometryService("http://sampleserver6.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer"); var dLayer = new ArcGISDynamicMapServiceLayer("http://sampleserver5.arcgisonline.com/arcgis/rest/services/911CallsHotspot/MapServer"); map.addLayer(dLayer); on(map, 'load', createToolbar); function createToolbar() { var toolbar = new Draw(map); toolbar.activate(Draw.EXTENT); toolbar.on("draw-end", addToMap); } function addToMap(evt) { map.graphics.clear(); evt.target.deactivate(); var graphic = new Graphic(evt.geometry, new SimpleFillSymbol()); console.info("In Geometry: ", evt.geometry.xmax, evt.geometry.xmin, evt.geometry.ymax, evt.geometry.ymin); map.graphics.add(graphic); var params = new ProjectParameters(); params.geometries = [evt.geometry]; params.outSR = new SpatialReference({wkid:102726}); gsvc.project(params, lang.hitch(this, function(geomsArr){ console.info("Out Geometry: ", geomsArr[0].xmax, geomsArr[0].xmin, geomsArr[0].ymax, geomsArr[0].ymin); })); } }); </script> </head> <body> <div id="map"></div> </body> </html>
Thanks Robert
Glad to help. Now it is your turn to help the community by marking this question as answered. All you have to do is click the "Correct Answer" link (the one with the little green star) on the post that provided the answer for you. If the answer was not provided by one of the responders then you can mark any of the replies that you received as helpful by clicking on the "Actions" menu and choosing "Mark as Helpful"