Defining extent in Projected Coordinate System

[TheoMorrissey]

Hi,

I have been struggling with the projection of my mapimage extent definition using the wkid keyword. I am able to display the image on the basemap, but only in geographical coordinate systems. When I change the wkid from 4326 (GCS_WGS_1984) to 32610 (WGS_1984_UTM_Zone_10N) the image no longer loads onto the layer. Any help would be greatly appreciated.

    'extent':
      { 'xmin': -125.1823, 'ymin': 53.4984, 'xmax': -121.5028, 'ymax': 55.5116, 'spatialReference':
         { 'wkid': 4326 }
      }

Thanks!

[TheoMorrissey]

It might be useful to see the whole script:

<script>
    dojo.require("esri.map");
    dojo.require("esri.layers.MapImageLayer");

  function init()
   {
     var map = new esri.Map("mapDiv",
      {
        center: [-123.3673, 54.51],
        zoom: 6,
        basemap: "topo"
      });
  
  // create and add the layer
     var mil = new esri.layers.MapImageLayer(
      {
  'id': 'usgs_screen_overlay'
      });
  map.addLayer(mil);

  // create and add the actual image
     var mi = new esri.layers.MapImage(
      {
'extent':
{ 'xmin': -125.1823, 'ymin': 53.4984, 'xmax': -121.5028, 'ymax': 55.5116, 'spatialReference':
     { 'wkid': 4326 }
},
'href': 'TILERGB.jpg'
      });

  mil.addImage(mi); 
  
   }
    dojo.ready(init);
  </script>

[JeffJacobson]

I haven't used a georeferenced image like this before, but I noticed this in the documentation for MapImageLayer.

The MapImageLayer class is used to add georeferenced images to the map.  The map will place the georeferenced images at the specified geographic  extent. The extent of the image should be within the map's extent. The  image should also be in the same coordinate system as the map.

Perhaps eliminating the basemap option from the Map constructor would fix the problem.

/*global require*/
require(["dojo/ready", "esri/map", "esri/layers/MapImageLayer", "esri/layers/MapImage"], function (ready, Map, MapImageLayer, MapImage) {
    "use strict";
    ready(function() {
        var map = new Map("mapDiv", {
            center: [-123.3673, 54.51],
            zoom: 6,
            basemap: "topo"
        });

        // create and add the layer
        var mil = new MapImageLayer({
            'id': 'usgs_screen_overlay'
        });
        map.addLayer(mil);

        // create and add the actual image
        var mi = new MapImage({
            'extent': {
                'xmin': -125.1823,
                    'ymin': 53.4984,
                    'xmax': -121.5028,
                    'ymax': 55.5116,
                    'spatialReference': {
                    'wkid': 4326
                }
            },
                'href': 'TILERGB.jpg'
        });

        mil.addImage(mi);

    });
});

[TheoMorrissey]

Thank you for your reply,

There is something I don't fully understand however. When adapting the tutorial example (http://help.arcgis.com/en/webapi/javascript/arcgis/sandbox/sandbox.html?sample=map_create) at first all I did was change the corner points and coordinate system within the .MapImage extent and didn't touch the .Map extent and it seemed to work.

I did take your advice about fixing the .Map coordinate system but have come across a problem (nothing displays). Again, substituting a Geographic Coordinate System wkid for the Projected Coordinate System (PCS) wkid works (or at least returns a map display on the webpage). Only thing is the layers are slightly off as the coordinates that I have for the four corners are in a PCS (wkid 32610).

I understand that a problem might arise when displaying a world map in a regionally specific PCS and so the basemaps may not be compatible with PCS wkids but haven't seen this mentioned in the documentation. Is this the issue?

I am quite new to javascript so there is a possibility I am missing something obvious.

  function init()
   {
     var map = new esri.Map("mapDiv", 
      {
        center: [-123.3673, 54.51],
        zoom: 6,
        basemap: "topo",
 extent: new esri.geometry.Extent({spatialReference: 
     { wkid: 32610 }})
      });

   }