How to request a single PNG/JPG image for a layered map using the JS API

1770
4
Jump to solution
11-16-2016 08:02 AM
AndrewBoland
New Contributor

I need to generate some map images for use in a web application, using the Nat Geo base map, an ocean contour layer and some points plotted from a KML file. I have the map working OK using the 3.18 JS library, but I don't want a dynamic, tiled image returned, just a single PNG or JPG image that I can then save locally. Is this possible? New to ArcGIS and mapping in general! Thanks.

0 Kudos
1 Solution

Accepted Solutions
RobertScheitlin__GISP
MVP Emeritus

Andrew,

   For that you would use the PrintTask and MAP_ONLY print template. Here is a snippet of code that I use for this purpose:

        var oWid = this.map.width;
        var oHgt = this.map.height;
        var printTask = new PrintTask('YOURS /rest/services/ExportWebMap/GPServer/Export Web Map');
        var template = new PrintTemplate();
        this.imgHeight = (740/oWid) * oHgt;
        template.exportOptions = {
          width: 1542,
          height: (1542/oWid) * oHgt,
          dpi: 200
        };
        template.format = "jpg";
        template.layout = "MAP_ONLY";
        template.preserveScale = false;
        template.showAttribution = false;

        var params = new PrintParameters();
        params.map = this.map;
        params.template = template;
        printTask.execute(params, lang.hitch(this, this.printResult));

      printResult: function(rsltURL){
        var mapImg = domConstruct.toDom('<img src="'+rsltURL.url+'" border="0" style="width:740px;height:'+this.imgHeight+'px;"/>');
        domConstruct.place(mapImg, dom.byId('mapImgDiv'), 'replace');
      },

View solution in original post

4 Replies
RobertScheitlin__GISP
MVP Emeritus

Andrew,

   For that you would use the PrintTask and MAP_ONLY print template. Here is a snippet of code that I use for this purpose:

        var oWid = this.map.width;
        var oHgt = this.map.height;
        var printTask = new PrintTask('YOURS /rest/services/ExportWebMap/GPServer/Export Web Map');
        var template = new PrintTemplate();
        this.imgHeight = (740/oWid) * oHgt;
        template.exportOptions = {
          width: 1542,
          height: (1542/oWid) * oHgt,
          dpi: 200
        };
        template.format = "jpg";
        template.layout = "MAP_ONLY";
        template.preserveScale = false;
        template.showAttribution = false;

        var params = new PrintParameters();
        params.map = this.map;
        params.template = template;
        printTask.execute(params, lang.hitch(this, this.printResult));

      printResult: function(rsltURL){
        var mapImg = domConstruct.toDom('<img src="'+rsltURL.url+'" border="0" style="width:740px;height:'+this.imgHeight+'px;"/>');
        domConstruct.place(mapImg, dom.byId('mapImgDiv'), 'replace');
      },
AndrewBoland
New Contributor

Hi - thanks for the reply. I should have said the we don't have an ArcGIS server instance which I think this solution relies on? 

Thanks, Andy

0 Kudos
RobertScheitlin__GISP
MVP Emeritus
0 Kudos
AndrewBoland
New Contributor

Ok I'll investigate that - thanks a lot.

0 Kudos