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

ChrisSergent — Mon, 24 Nov 2014 16:17:59 GMT

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>

<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>

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>

<h3>

ArcGIS.com Webmap and the Print Dijit

</h3>

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

</div>

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>

</div>

</div>

</div>

</body>

</html>

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

KellyHutchins — Mon, 24 Nov 2014 20:33:15 GMT

The original sample used a web map id along with the createMap method. The createMap method takes a web map id and the response contains a map along with info about the web map. So the following code that you have in your sample won't work for a regular map. Try removing this code and just call createPrintDijit with a string value you want to use for the title.

map.then(function (resp) {

app.mapInfo = resp.itemInfo.item;

app.map = resp.map;

createPrintDijit(app.mapInfo.title);

});

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

ChrisSergent — Mon, 24 Nov 2014 21:47:04 GMT

I removed that block and replaced it with

createPrintDijit("Print Map");

I also added the following line before my proxy information:

parser.parse();

I am now receiving an error when I attempt to select one of the print options: Uncaught TypeError: Cannot read property 'layerIds' of undefined PrintTask.js:21

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

KellyHutchins — Mon, 24 Nov 2014 22:03:10 GMT

There are still several issues with your app. In the code where you create Print you set the map constructor option to app.map and no app.map exists. I also don't see app.printUrl defined anywhere in your code. Finally you call startup on app.print when it should be app.printer.

app.printer = new Print({

map: app.map,

templates: templates,

url: app.printUrl

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

app.print.startup();

topic Trying to get the Print webmap to work with our map server in ArcGIS JavaScript Maps SDK Questions

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

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

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

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

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

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

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

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