Add raster result to map

2645
10
05-01-2013 12:49 PM
StephenFricke
New Contributor III
Hey everyone,

I would really appreciate it if someone could help me out.  Right now I have a geoprocessing tool that runs when someone specifies some parameters and selects an area of interest in a map service window.  The geoprocesing tool downloads netCDF climate data for that selected area of interest, and then converts the netCDF data into a raster.  When the tool is done running, I would like to add this raster to the map.  Does anyone know how I can do this?  I was figuring I would need to create a dynamic map service layer from the raster, and then add it to the map, but I am not quite sure how to go about this in the javascript.  Any help would be very much appreciated.  Thank you!
0 Kudos
10 Replies
derekswingley1
Frequent Contributor
0 Kudos
StephenFricke
New Contributor III
Thanks for the reply.  I saw this example as well.  I guess I am just not sure on how to get the correct url to my raster.  It appears in the example that there was a mapservice already created, I am not sure what the equivalent of "var mapserviceurl" would be for me?  My raster is just an output of the gp service that is being run.  I would like to create a map service layer with this raster.  Right now, I have set a parameter in my gp tool to be a file which leads to this raster.  When I use that file path as the url to make the map service layer it seems to be invalid.  Any ideas?  Thanks again.
0 Kudos
StephenFricke
New Contributor III
I keep getting this syntax error that I can't seem to figure out.  The raster that I want to add to the map is a derived "raster dataset".  In the onTaskComplete function, I get the raster result with this line:

gpTask.getResultData(jobInfo.jobId,"Output");


And then in the onResultComplete fuction my code looks like this:

function onTaskResultComplete(paramResult) {

//retrieve the value of the parameter from the paramresult

var featureSet = paramResult.value.url;

var normalslayer = new esri.layers.ArcGISDynamicMapServiceLayer(featureSet); 

}


For some reason the normalslayer is failing because of some syntax issue.  The featureSet variable is the correct url to where my raster dataset is located, so I am not sure what the problem is?  Any help is much appreciated.
0 Kudos
SteveCole
Frequent Contributor
I think the syntax issue is that what's returned by your GP service isn't a dynamicMapServiceLayer. I'm not sure which of the other "layer types" that you should use but I'm going to guess that it's mapImageLayer (which incorporates mapImage).
0 Kudos
StephenFricke
New Contributor III
I think the syntax issue is that what's returned by your GP service isn't a dynamicMapServiceLayer. I'm not sure which of the other "layer types" that you should use but I'm going to guess that it's mapImageLayer (which incorporates mapImage).


Ok great, thank you for the response.  So then I will change:

var normalslayer = new esri.layers.ArcGISDynamicMapServiceLayer(featureSet); 


to:

var normalslayer = new esri.layers.MapImageLayer(featureSet); 


Then do you know the necessary code to add the image to the map?  Thank you!!!
0 Kudos
SteveCole
Frequent Contributor
No, not quite. It's a little more complicated than that. 😄

*IF* mapImageLayer is the correct layer type to use (and again, I'm not sure it is), you would construct your layer something like this:

  var stormPrecipMi = new esri.layers.MapImage({
    'extent': { 'xmin': -125.721041648, 'ymin': 45.1377145386, 'xmax': -119.246964944, 'ymax': 51.0722848511, 'spatialReference': { 'wkid': 4326 }},
    'href': "http://radar.weather.gov/ridge/RadarImg/NTP/ATX_NTP_0.gif"
  });
  stormPrecipMi.height = 550;
  stormPrecipMi.width = 600;
  stormPrecipMi.scale = 1;
  
  nwsStormPrecipLayer = new esri.layers.MapImageLayer({
      id: 'nwsStormPrecip',
   opacity: 0.5
  });

  nwsStormPrecipLayer.addImage(stormPrecipMi);
  map.addLayer(nwsStormPrecipLayer,7);


Note that you'll need to know the coordinate extent of your results (but you should know that since you're passing a shape or extent to your GP service, right?). Place the URL returned from your GP results where I have the URL under the 'href' parameter in the mapImage constructor.

Hopefully someone else more knowledgable will chime in and confirm whether or not mapImageLayer is the right path to take.

Steve
0 Kudos
StephenFricke
New Contributor III
No, not quite. It's a little more complicated than that. 😄

*IF* mapImageLayer is the correct layer type to use (and again, I'm not sure it is), you would construct your layer something like this:

  var stormPrecipMi = new esri.layers.MapImage({
    'extent': { 'xmin': -125.721041648, 'ymin': 45.1377145386, 'xmax': -119.246964944, 'ymax': 51.0722848511, 'spatialReference': { 'wkid': 4326 }},
    'href': "http://radar.weather.gov/ridge/RadarImg/NTP/ATX_NTP_0.gif"
  });
  stormPrecipMi.height = 550;
  stormPrecipMi.width = 600;
  stormPrecipMi.scale = 1;
  
  nwsStormPrecipLayer = new esri.layers.MapImageLayer({
      id: 'nwsStormPrecip',
   opacity: 0.5
  });

  nwsStormPrecipLayer.addImage(stormPrecipMi);
  map.addLayer(nwsStormPrecipLayer,7);


Note that you'll need to know the coordinate extent of your results (but you should know that since you're passing a shape or extent to your GP service, right?). Place the URL returned from your GP results where I have the URL under the 'href' parameter in the mapImage constructor.

Hopefully someone else more knowledgable will chime in and confirm whether or not mapImageLayer is the right path to take.

Steve


Hey Steve, thanks for that code snippet.  I am still unable to get anything added to the map.  I don't get any errors, but I get a warning, "Resource interpreted as Image but transferred with MIME type image/tiff".  Not really sure what I should be doing different?  If you have any idea I let me know.  Thanks again!
0 Kudos
SteveCole
Frequent Contributor
Ok, well, that's good to know. I looked at the API reference for mapImage and TIFF is not one of the supported data types:

Known values: gif | jpg | png | bmp


To use the mapImageLayer option, your GP result would have to return an image in one of those other formats. This might be a catch-22 for you IF you want the user to be able to query (i.e. display an infoWindow) the cell values. Sadly, mapImageLayers don't support this.

Again, I'm stretching my knowledge base a bit with this so I'm really hoping someone from ESRI can chime in!

Steve

EDIT: I'm starting to think Derek is right (I really shouldn't doubt is suggestions!). Can you post more of your code, specifically the lead up to your GP service and then the callback routine for the results?
0 Kudos
StephenFricke
New Contributor III
Ok, well, that's good to know. I looked at the API reference for mapImage and TIFF is not one of the supported data types:

Known values: gif | jpg | png | bmp


To use the mapImageLayer option, your GP result would have to return an image in one of those other formats. This might be a catch-22 for you IF you want the user to be able to query (i.e. display an infoWindow) the cell values. Sadly, mapImageLayers don't support this.

Again, I'm stretching my knowledge base a bit with this so I'm really hoping someone from ESRI can chime in!

Steve

EDIT: I'm starting to think Derek is right (I really shouldn't doubt is suggestions!). Can you post more of your code, specifically the lead up to your GP service and then the callback routine for the results?



Hey Steve, thank you so much.  I do want to be able to query cell values, so I agree that the Image Layer is probably not the avenue I want to go.  Here is the lead up to my gp service:

      function initSelectionToolbar(myMap){
        selectionToolbar = new esri.toolbars.Draw(map);

        dojo.connect(selectionToolbar, "onDrawEnd", function(geometry) {

          selectionToolbar.deactivate();
          var symbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASHDOT, new dojo.Color([255,0,0]), 2), new dojo.Color([255,255,0,0.25]));
          var graphic = new esri.Graphic(geometry, symbol);
          var geoPoly= esri.geometry.webMercatorToGeographic(geometry);
          //map.graphics.add(graphic);
  xmax= (geoPoly.xmin*-1);
  xmin= (geoPoly.xmax*-1);
  ymin= (geoPoly.ymin);
  ymax= (geoPoly.ymax);

 selectNameModelVal = document.getElementById('options1').value;
   selectNameScenarioVal = document.getElementById('options2').value;
 selectNameVariableVal = document.getElementById('options3').value;
 selectNameDay1Val = document.getElementById('options4').value;
 selectNameDay2Val = document.getElementById('options5').value;
 selectNameYear1Val = document.getElementById('options6').value;
 NormalsYears = document.getElementById('options7').value;


 var gpTask = new esri.tasks.Geoprocessor("http://inside-dev2.nkn.uidaho.edu:6080/arcgis/rest/services/REACCH/MACAnormsRas/GPServer/MACA%20Normals%20Histogram-%20raster%20output");
 var params = { "GCM_Model":selectNameModelVal, "GCM_Scenario":selectNameScenarioVal, "Variable":selectNameVariableVal,"Day_1":selectNameDay1Val,"Day_2":selectNameDay2Val, "Year_1":selectNameYear1Val, "Number_of_years_to_average_to_create_climate_normals":NormalsYears,"Min_Lat":ymin,"Max_Lat":ymax,"Min_Lon":xmin,"Max_Lon":xmax };

 dojo.connect(gpTask, "onJobComplete",onTaskComplete);
  dojo.connect(gpTask, "onError",onTaskFailure);
  dojo.connect(gpTask, "onStatusUpdate",onTaskStatus);
 gpTask.submitJob(params);
        });


      }
    
      }


So then when the job completes it goes to this function:
function onTaskComplete(jobInfo) {

    /*get the value of an output parameter Buffer_polygons using getResultData. The name of the output may vary in your gpTask*/ 
 var gpTask = new esri.tasks.Geoprocessor("http://inside-dev2.nkn.uidaho.edu:6080/arcgis/rest/services/REACCH/MACAnormsRas/GPServer/MACA%20Normals%20Histogram-%20raster%20output");
 dojo.connect(gpTask,"onGetResultDataComplete",onTaskResultComplete);
 gpTask.getResultData(jobInfo.jobId,"Output");


So remember, this "Output", is a "raster dataset" which the gp service produces.  Then I can retrieve the location of where that raster dataset has been saved using this code:


function onTaskResultComplete(paramResult) {

   //retrieve the value of the parameter from the paramresult

   var featureSet = paramResult.value.url;


I have visited this "featureSet" url, and it is the correct location, but it does appear to be a .tif file.  When I run the gp service in arcgis it produces a raster dataset which I can analyze in arcmap.  Do you think it is possible I have to define this output parameter as something different than "raster dataset" when I am originally creating the tool in arcgis?
0 Kudos