Can't get correct extent on World Stree Map

[PatrickBinns]

I'm a beginner to the ESRI API and scripting in general. I'm trying to make a basic web map with the World_Street_Map layer but the extent I use shows "no map data available" because it's off in the ocean on the wrong side of the world! If I use that same extent (same x y coordinates) with the ESRI_StreetMap_World_2D layer it works fine though. Can anyone give me some advice on what I'm missing? Any help would be appreciated because I'm stuck right now.

Here's the code for the test that uses the World_Street_Map (the one that's not working)...

function init() { 
  var startExtent = new esri.geometry.Extent(-95.4, 40.887, -94.908, 41.171,         
      new esri.SpatialReference({wkid:102100}) ); 

myMap = new esri.Map("mapDiv", { extent: startExtent }); 
  var mapServiceURL = "http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"; 
myMap.addLayer(new esri.layers.ArcGISTiledMapServiceLayer(mapServiceURL));

}

Here's the code for the test that uses the ESRI_StreetMap_World_2D layer (the one that works fine)...

function init() { 
  var startExtent = new esri.geometry.Extent(-95.4, 40.887, -94.908, 41.171,         
      new esri.SpatialReference({wkid:4326}) ); 

myMap = new esri.Map("mapDiv", { extent: startExtent }); 
  var mapServiceURL = "http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer"; 
myMap.addLayer(new esri.layers.ArcGISTiledMapServiceLayer(mapServiceURL));

}

[KellyHutchins]

The World_Street_Map service has a spatial reference of 102100 (Web Mercator) and the coordinates that you supply are in geographic (4326). You can resolve the problem by specifying your extent in geographic then using esri.geometry.geographicToWebMercator to convert the coordinates. Here's a code snippet that shows this:

        var initExtent = new esri.geometry.Extent({"xmin":-122.46,"ymin":37.73,"xmax":-122.36,"ymax":37.77,"spatialReference":{"wkid":4326}});
        map = new esri.Map("map",{
          extent:esri.geometry.geographicToWebMercator(initExtent)
        });

[derekswingley1]

The conceptual help topic Working with Extents is worth a read.

In your example that doesn't work, you're specifying what looks like lat, long coordinates but saying the spatial reference is web mercator (wkid 102100). If you want to create an extent as lat, long but apply it to a map service that uses webmercator, create the extent as lat, long (wkid 4326) and convert it to webmercator using esri.geometry.geographicToWebMercator().

[PatrickBinns]

Thank you both Kelly and swingley! With your explanation I'm now able to get it to work properly. Thanks again!

[derekswingley1]

Glad to help! You should mark Kelly's post as an answer, she was first 🙂