exportMapImage - Newbie trying to integrate it

1254
5
09-21-2010 09:51 AM
HeathClark
New Contributor III
I am trying to get the following function to work, however, it gives an "unsupoorted method" error at mapImage=map.exportMapImage(mExport_Settings); - What have I missed? (using 1.6 and have set dojo.require("esri.layers.agsdynamic"); as per API).  I know there is an option for a callback in the exportMapImage() but for now I am just testing things.

function ExportMap() {
            var mExport_Settings = new esri.layers.ImageParameters();

            //Could be png8/24, jpg,bmp,gif
            mExport_Settings.format = "png24";
            mExport_Settings.bbox = map.extent;
            mExport_Settings.height = "800";
            mExport_Settings.width = "800";
            mExport_Settings.layerIds = [1, 4];
            mExport_Settings.layerOption = esri.layers.ImageParameters.LAYER_OPTION_SHOW;
            mExport_Settings.transparent = true;

            var mapImage = esri.layers.MapImage;

            mapImage = map.exportMapImage(mExport_Settings);
            alert(mapImage.href);
            
        }
0 Kudos
5 Replies
derekswingley1
Frequent Contributor
First thing, exportMapImage is a layer method, not a map method so you need to call it on a dynamic map service layer. Second, provide a callback function to handle the map image that is returned. Something like this:
<!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>Create Map</title> 
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.1/js/dojo/dijit/themes/claro/claro.css"> 
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.1"></script> 
    <script type="text/javascript"> 
      dojo.require("esri.map");
 
      function init() {
        var map = new esri.Map("map");
        var dLayer = new esri.layers.ArcGISDynamicMapServiceLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Population_World/MapServer", {"opacity":0.5});
 map.addLayer(dLayer);

 var params = new esri.layers.ImageParameters();
 params.format = 'png24';
 params.bbox = map.extent;
 params.height = '800';
 params.width = '800';
 params.layerIds = [0];
 params.layerOption = esri.layers.ImageParameters.LAYER_OPTION_SHOW;
 params.transparent = true;
    
 dLayer.exportMapImage(params, function(img) {
  console.log(img);
 });
      }
 
      dojo.addOnLoad(init);
    </script> 
  </head> 
  <body class="claro"> 
    <div id="map" style="width:900px; height:600px; border:1px solid #000;"></div> 
  </body> 
</html
0 Kudos
HeathClark
New Contributor III
thanks, if I could read I might have picked up on that fact.  It obviously works as described.

However, is there a way to "push" multiple layers (and even a graphics layer) into that same export process to have composite image? (that my be a bit over my skill set but I thought I'd ask it)
0 Kudos
BillAdkins
New Contributor
Same question as above, is it possible to push multiple dynamic layers onto an image?  Question that has been asked in many ways, but I am trying to create a decent print page and do not want to use the methods available in the code gallery.
0 Kudos
Mohd_HairiHamzah
New Contributor
First thing, exportMapImage is a layer method, not a map method so you need to call it on a dynamic map service layer. Second, provide a callback function to handle the map image that is returned. Something like this:
<!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>Create Map</title> 
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.1/js/dojo/dijit/themes/claro/claro.css"> 
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.1"></script> 
    <script type="text/javascript"> 
      dojo.require("esri.map");
 
      function init() {
        var map = new esri.Map("map");
        var dLayer = new esri.layers.ArcGISDynamicMapServiceLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Population_World/MapServer", {"opacity":0.5});
 map.addLayer(dLayer);

 var params = new esri.layers.ImageParameters();
 params.format = 'png24';
 params.bbox = map.extent;
 params.height = '800';
 params.width = '800';
 params.layerIds = [0];
 params.layerOption = esri.layers.ImageParameters.LAYER_OPTION_SHOW;
 params.transparent = true;
    
 dLayer.exportMapImage(params, function(img) {
  console.log(img);
 });
      }
 
      dojo.addOnLoad(init);
    </script> 
  </head> 
  <body class="claro"> 
    <div id="map" style="width:900px; height:600px; border:1px solid #000;"></div> 
  </body> 
</html


Hi, i also need to create a function to export the map to an image like jpeg, png or anything.. I tried the code above. The map loaded without any problem but nothing happened after that. Will this function export the map image to png? I also tried to prompt an alert (alert(img);) but didn't work.. ANy advise?
0 Kudos
HeathClark
New Contributor III
The exportMapImage method will create an image (png/jpeg) in your server/arcgisoutput folder that you will have to obtain a reference to then display/copy/move/etc.  based on your application.


var mExport_Settings = new esri.layers.ImageParameters();

    //Set image formate property could be png | png8 | png24 | jpg | pdf | bmp | gif | svg
    //ALWASY USE PNG FORMAT SO WORLD FILE AND PROJECTION FILE WORK
    mExport_Settings.format = "png24";
    mExport_Settings.bbox = map.extent;
    mExport_Settings.height = 1600;
    mExport_Settings.width = 1600;
    mExport_Settings.dpi = 300;
    mExport_Settings.layerIds = [10000];
    mExport_Settings.layerOption = esri.layers.ImageParameters.LAYER_OPTION_EXCLUDE;
    mExport_Settings.transparent = true;

    facility_service.exportMapImage(mExport_Settings, function(mapImage) {

        var xmin = map.extent.xmin;
        var ymin = map.extent.ymin;
        var xmax = map.extent.xmax;
        var ymax = map.extent.ymax;

        var extent_string = xmin + "|" + ymin + "|" + xmax + "|" + ymax;

        var jGraphics = "";

        if (redlineMarkup_GraphicsLayer != null) {
            if (redlineMarkup_GraphicsLayer.graphics.length > 0) {
                for (var i = 0, il = redlineMarkup_GraphicsLayer.graphics.length; i < il; i++) {
                    var gJ = redlineMarkup_GraphicsLayer.graphics.toJson();
                    jGraphics += dojo.toJson(gJ) + "#";
                }
            }
        }

        var lString = mapImage.href + "|" + dojo.toJson(map.extent.toJson()) +"|" + extent_string + "|" + jGraphics + "|" + note_string + "|" + mExport_Settings.width + "|" + mExport_Settings.height;

        intialize_redline_export_callback.PerformCallback(lString);
    });



intialize_redline_export_callback.PerformCallback(lString); is a callback function in my .net "codebehind" page that takes the mapImage.href value and copies the .png file from the ArcGIS Server to another location and logs that location in a database for later viewing.

hope that helps a bit.
0 Kudos