World_Topo_Map initialExtent Error

TomNeer · ‎09-15-2011

I'm finally getting around to learning the ArcGIS API for JavaScript and seem to run into a bug. It seems that the World_Topo_Map service will not take an initialExtent without erroring out to 0,0 (Lat/Lon). But the ESRI_StreetMap_World_2D works fine.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title></title>
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.1"></script>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.1/js/dojo/dijit/themes/tundra/tundra.css">
    
    <script type="text/javascript">
      dojo.require("esri.map");
      var myMap;
      
      function init() {
        myMap = new esri.Map("mapDiv");
        var spatialRef = new esri.SpatialReference({wkid:4326});
        var startExtent = new esri.geometry.Extent();
        startExtent.xmin = -124.71;
        startExtent.ymin = 31.89;
        startExtent.xmax = -113.97;
        startExtent.ymax = 42.63;
        startExtent.spatialReference = spatialRef;

        myMap.setExtent(startExtent);
        var mapServiceURL = "http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer";
        //var mapServiceURL = "http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer";
        //Using the World_Topo_Map does not show proper startExtent
        myMap.addLayer(new esri.layers.ArcGISTiledMapServiceLayer(mapServiceURL));
        }
      dojo.addOnLoad(init);
    </script>
    
  </head>
  <body class="tundra">
    <div id="mapDiv" style="width:1024px; height:800px; border:1px solid #000;"></div>

  </body>
</html>

Comment/uncomment to toggle the layers. If someone could confirm that I'm not going insane and my code is correct, it would be greatly appreciated. TIA -Tom

SiqiLi · ‎09-20-2011

Hi Tom,
In your code, you specify the spatial reference used for the map extent is 4326. Since ESRI_StreetMap_World_2D map service uses SR 4326, your code is fine with that map service. However World_Topo_Map uses 102100, That's why your code doesn't work.

To solve the issue, please modify the definition of your spatial reference and map extent as follows:

  var spatialRef = new esri.SpatialReference({wkid:102100});
        var startExtent = new esri.geometry.Extent();
        startExtent.xmin = -14133053.98 ;
        startExtent.ymin = 3198163.32;
        startExtent.xmax = -11931667.56;
        startExtent.ymax = 4665754.26;
        startExtent.spatialReference = spatialRef;

If you want to get the information about extent, please check the following sample:
http://help.arcgis.com/en/webapi/javascript/arcgis/demos/map/map_currentextent.html

derekswingley1 · ‎09-20-2011

Additionally, if you want to use a wkid:4326 extent to specify the extent for a map in web mercator (wkid:102100), there is a helper method to convert between the two: esri.geometry.geographicToWebMercator.

Also check out the Working with Extents help topic in the conceptual help.