AnsweredAssumed Answered

Trying to get the Print webmap to work with our map server

Question asked by csergent08 Champion on Nov 24, 2014
Latest reply on Jan 21, 2015 by gschiopu

We have our own map server and I am trying to use the Print webmap example to create our print task, but it's not working. There is an error stating this is not a defined function:

map.then(function (resp) {

                             app.mapInfo = resp.itemInfo.item;

                             app.map = resp.map;

                             createPrintDijit(app.mapInfo.title);

                         });

 

 

I am using the example located at: Print webmap | ArcGIS API for JavaScript

The reason that I am using this code is that the print example does not show you how the code selects the type of printout:  Print | ArcGIS API for JavaScript

 

Any ideas how I get this to work?

Here is my code:

<!DOCTYPE html>

<html>

    <head>

        <title>Create a Map</title>

        <meta http-equiv="content-type" content="text/html; charset=utf-8">

        <meta name="viewport" content="initial-scale=1,maximum-scale=1, user-scalable=no">

        <link rel="stylesheet" href="http://js.arcgis.com/3.11/dijit/themes/soria/soria.css">

        <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">

        <style>

            html, body, #mapDiv

            {

                padding:0;

                margin:0;

                height:100%;

                width:100%;

                position:absolute;

                z-index:0;

            }

           

            /* Printer CSS Begin */

           

            h3 { margin: 0 0 5px 0;

                 border-bottom: 1px solid #444;

                 padding: 0 0 5px 0;

                 text-align: center;

                 }

              .shadow

              {

                -moz-box-shadow: 0 0 5px #888;

                -webkit-box-shadow: 0 0 5px #888;

                box-shadow: 0 0 5px #888;

              }

            #feedback

            {

                background: #fff;

                border: 2px solid #666;

                border-radius: 5px;

                bottom: 20px;

                color: #666;

                font-family: arial;

                height: auto;

                left: 20px;

                top:50%;

                margin: 5px;

                padding: 10px;

                position: absolute;

                width: 300px;

                z-index: 40;

            }

     

            #feedback a

            {

                border-bottom: 1px solid #888;

                color: #666;

                text-decoration: none;

            }

            #feedback a:hover, #feedback a:active, #feedback a:visited {

                border: none;

                color: #666;

                text-decoration: none;

            }

           

            #note

            {

                padding: 0 0 10px 0;

            }

           

            #info, #information

            {

                padding: 10px 0 0 0;

            }

           

            /* Printer CSS End */

        </style>

        <script src="http://js.arcgis.com/3.11/"></script>

        <script>

            var map;

            var app = {};

            require(["esri/map", "esri/config",

                     "esri/dijit/Print",

                     "esri/geometry/Extent",

                     "esri/layers/ArcGISDynamicMapServiceLayer",

                     "esri/layers/ArcGISTiledMapServiceLayer",

                     "esri/layers/FeatureLayer",

                     "esri/tasks/GeometryService",

                     "esri/tasks/PrintTemplate",

                     "dojo/_base/array",

                     "dojo/dom",

                     "dojo/on",

                     "dojo/parser",

                     "dijit/layout/BorderContainer",

                     "dijit/layout/ContentPane",

                     "dojo/domReady!"], function (Map, esriConfig, Print, Extent,

                                                  ArcGISDynamicMapServiceLayer, ArcGISTiledMapServiceLayer,

                                                  FeatureLayer, GeometryService, PrintTemplate, arrayUtils, dom, on, parser

 

 

            ) {

 

 

                         /* The proxy comes before all references to web services */

                         /* Files required for security are proxy.config, web.config and proxy.ashx

                         - set security in Manager to Private, available to selected users and select Allow access to all users who are logged in

                         (Roles are not required)

                         /*

                         The proxy section is defined on the ESRI sample. I have included it as

                         part of the documentation reads that the measuring will not work.

                         I thought that might be important.

                         */

 

 

                         // Proxy Definition Begin

                         //identify proxy page to use if the toJson payload to the geometry service is greater than 2000 characters.

                         //If this null or not available the project and lengths operation will not work.

                         // Otherwise it will do a http post to the proxy.

                         esriConfig.defaults.io.proxyUrl = "proxy.ashx";

                         esriConfig.defaults.io.alwaysUseProxy = false;

 

 

                         // Proxy Definition End

 

 

 

 

                         // set custom extent

                         var initialExtent = new Extent({

                             "xmin": 777229.03,

                             "ymin": 1133467.92,

                             "xmax": 848340.14,

                             "ymax": 1185634.58,

                             "spatialReference": {

                                 "wkid": 3435

                             }

                         });

 

 

                         // create map and set slider style to small

                         var map = new Map("mapDiv", {

                             showAttribution: false,

                             sliderStyle: "small",

                             extent: initialExtent

                         });

 

 

                         // add imagery

                         var tiled = new ArcGISTiledMapServiceLayer("http://maps.decaturil.gov/arcgis/rest/services/Aerial_2014_Tiled/MapServer");

                         map.addLayer(tiled);

                         // set operational layers

                         var operationalLayer = new ArcGISDynamicMapServiceLayer("http://maps.decaturil.gov/arcgis/rest/services/Public/InternetVector/MapServer", { "opacity": 0.5 });

                         // add operational layers

                         map.addLayer(operationalLayer);

 

 

                         // declare geometry service

                         esriConfig.defaults.geometryService = new GeometryService("http://maps.decaturil.gov/arcgis/rest/services/Utilities/Geometry/GeometryServer");

 

 

                         map.then(function (resp) {

                             app.mapInfo = resp.itemInfo.item;

                             app.map = resp.map;

                             createPrintDijit(app.mapInfo.title);

                         });

 

 

 

 

                         function createPrintDijit(printTitle) {

                             var layoutTemplate, templateNames, mapOnlyIndex, tempplates;

 

 

                             // create an array of object that will be used to create print templates

                             var layouts = [{

                                 name: "Letter ANSI A Landscape",

                                 label: "Landscape (PDF)",

                                 format: "pdf",

                                 options: {

                                     legendLayers: [], // empty array means no legend

                                     scalebarUnit: "Miles",

                                     titleText: printTitle + ", Landscape PDF"

                                 }

                             }, {

                                 name: "Letter ANSI A Portrait",

                                 label: "Portrait (Image)",

                                 format: "jpg",

                                 options: {

                                     legendLayers: [],

                                     scalebarUnit: "Miles",

                                     titleText: printTitle + ", Portrait JPG"

                                 }

                             }];

 

 

 

 

                             // create print templates

                             var templates = arrayUtils.map(layouts, function (lo) {

                                 var t = new PrintTemplate();

                                 t.layout = lo.name;

                                 t.label = lo.label;

                                 t.format = lo.format;

                                 t.layoutOptions = lo.options;

                                 return t;

                             });

 

 

                             app.printer = new Print({

                                 map: app.map,

                                 templates: templates,

                                 url: app.printUrl

                             }, dom.byId("print_button"));

                             app.print.startup();

                         }

 

 

 

 

                     }

            );

        </script>

    </head>

    <body class="soria">

        <div id="mapDiv">

            <!-- Feedback Begin -->

            <div id="feeback">

                <h3>

                    ArcGIS.com Webmap and the Print Dijit

                </h3>

                <!-- Info Begin -->

                <div id="info">

                    <!-- Note Begin -->

                    <div id="note">

                        Note:  This sample uses an ArcGIS Server version 10.1 export web map task.

                    </div>

                    <!-- Note End -->

 

 

                    <!-- Used for the print dijit -->

                    <div id="print_button"></div>

 

 

                    <!-- Info Begin -->

                    <div id="information">

                        The map is <a href="https://developers.arcgis.com/javascript/jsapi/esri.arcgis.utils-amd.html#createmap">created from an ArcGIS.com webmap</a> and

                        <a href="https://developers.arcgis.com/javascript/jsapi/printtemplate-amd.html">print templates</a> are

                        created manually. Refer to the documentation for more print template options (output formats, additional layouts, etc.).

                    </div>

                    <!-- Information End -->

                </div>

                <!-- Info End -->

            </div>

            <!-- Feeback End -->

        </div>

    </body>

</html>

Outcomes