<!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>Zoom to non-WM dynamic layer</title> <link rel="stylesheet" href="http://js.arcgis.com/3.6/js/esri/css/esri.css"/> <style> html,body,#mapDiv{ padding:0; margin:0; height:100%; } </style> <script src="http://js.arcgis.com/3.6/"></script> <script> dojo.require("esri.map"); var map; var url = "http://loczy.mfgi.hu/ArcGIS/rest/services/TJAM/surf_ujfalu_t/MapServer/" function init() { //Get the layer's extent from ArcGIS Server esri.request({ url: url, content: {f: "json"}, handleAs: "json", callbackParamName: "callback", load: function(response) { //Create the map. Since we're specifying the Gray basemap it'll use Web Mercator map = new esri.Map("mapDiv", {basemap: "gray"}); //Add the dynamic layer. Although it's not stored in Web Mercator, it's automatically //projected on-the-fly and displays in the correct location var dynamicMapServiceLayer = new esri.layers.ArcGISDynamicMapServiceLayer(url); map.addLayer(dynamicMapServiceLayer); //Zoom the map to the new layer's extent. This fails, since the extent doesn't use WM map.setExtent(response.initialExtent); }, error: function (error) { alert("Sorry, there was a problem zooming to the new layer"); } }); } dojo.ready(init); </script> </head> <body> <div id="mapDiv"></div>\ </body> </html>
Solved! Go to Solution.
var srcProj = new Proj4js.Proj('EPSG:YOUR_WKID'); var destProj = new Proj4js.Proj('EPSG:3857'); // 3857 is the default map WKID var bottomLeft = new Proj4js.Point(response.initialExtent.minx, response.initialExtent.miny); Proj4js.transform(srcProj, destProj, bottomLeft); var topRight = new Proj4js.Point(response.initialExtent.maxx, response.initialExtent.maxy); Proj4js.transform(srcProj, destProj, topRight); map.setExtent(bottomLeft.x, bottomLeft.y, topRight.x, topRight.y, map.spatialReference);
// include the library
<script src="lib/proj4js-combined.js"></script>
<!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>Zoom to non-WM dynamic layer</title> <link rel="stylesheet" href="http://js.arcgis.com/3.6/js/esri/css/esri.css"/> <style> html, body, #mapDiv { padding: 0; margin: 0; height: 100%; } </style> <script src="http://js.arcgis.com/3.6/"></script> <script> dojo.require("esri.map"); dojo.require("esri.tasks.geometry"); var map; var url = "http://loczy.mfgi.hu/ArcGIS/rest/services/TJAM/surf_ujfalu_t/MapServer/" var gsUrl = "http://server.domain.com/arcgis/rest/services/Geometry/GeometryServer"; // url to your geometry service function init(){ map = new esri.Map("mapDiv",{basemap: "gray"}); var dynamicMapServiceLayer = new esri.layers.ArcGISDynamicMapServiceLayer(url); dynamicMapServiceLayer.on('load',function(){ var projectParams = new esri.tasks.ProjectParameters(); projectParams.geometries = [dynamicMapServiceLayer.initialExtent]; projectParams.outSR = map.spatialReference; var gs = new esri.tasks.GeometryService(gsUrl); gs.project(projectParams).then(function(projectedGeometries){ var initialExtentWM = projectedGeometries[0]; map.setExtent(initialExtentWM); }); }); map.addLayer(dynamicMapServiceLayer); } dojo.ready(init); </script> </head> <body> <div id="mapDiv"></div> </body> </html>
you don't need to use esri.request, just listen for the layer 'onLoad' event and then the initialExtent is a property of the layer.