Printing Popup Contents

15908
75
Jump to solution
10-26-2016 12:42 AM
ÇankayaBelediyesi
New Contributor III

I have a Web Mapping Application with a standard Print Widget. I would like to include the contents of the popup window in the printout.

Here is an example:

GIS Portal for the City of Abilene, TX

Standard printout:

Standard printout

Popup window:

Popup window

Desired printout:

Desired printout

My research so far:

There is a BLOG POST by esri explaining how to do this. This post shows 2 methods. The first method is not suitable for my purposes cause it requires manual data entries for each printout. The second method seems incomplete, Format & Layout_Template parameters are missing. Print does not work even if I add those parameters manually before publishing the service. If the second method worked properly, I would have modified it to match my needs, unfortunately it doesn't.

http://stackoverflow.com/questions/32363943/arcgis-javascript-web-map-printout-with-popup-shown

dojoOn(map.infoWindow, "selection-change", function(){ //build custom text here }

My knowledge on JavaScript is limited, so I couldn't manage what he explained here. Where am I supposed to add this and what should I include in the function?

http://gis.stackexchange.com/questions/111360/populate-a-layout-text-element-with-the-description-fr...

We have the print button generating an html page that pulls data from the database and formats it in pretty much an exact replica of the .mxd we were using. For the map it uses a function on the rest endpoint to generate an image from the map service.

This seems even more complicated than the others.

Either one the above solutions works for me.

  1. add popup contents at the bottom of the print layout
  2. make use of "selection-change" event
  3. generate a new html page
  4. any other suggestion

TL;DR I want to include popup window or it's contents in the printout.

Thanks in advance.

75 Replies
deleted-user-Z_OeT-WY_0pI
New Contributor II

I have been to those and I don't see where the var gra = this.map.infoWindow.getSelectedFeature   is at. I just need to add the info window attribute info from a selected parcel into a print service.

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Rich,

  Those threads do not exactly deal with what you are wanting. Bu the basic location of the code is the same.

0 Kudos
deleted-user-Z_OeT-WY_0pI
New Contributor II

Sorry, but I am fairly new to some of this. I see the

//See if there is a parcel search layer added to the map
 var plyr;
 array.some(this.map.graphicsLayerIds, lang.hitch(this, function (layerId) {
 var lyr = this.map.getLayer(layerId);
 if(lyr.name === "Search Results: Parcels"){
 plyr = lyr;
 return true;
 }
 }));
 if(plyr){
 var xppins = "", obj, cTextElements = [];
 array.map(plyr.graphics, lang.hitch(this, function(gra, index){
 if (plyr.graphics.length === 1){
 obj = {OwnerName: "Owner Name: " + gra.attributes.NAME};
 cTextElements.push(obj);
 obj = {PPIN: "PPIN: " + gra.attributes.PPIN};
 cTextElements.push(obj);
 obj = {ParcelNum: "Parcel Number: " + gra.attributes.PARCEL_NUMBER};
 cTextElements.push(obj);
 obj = {StreetAdd: "Street Address: " + gra.attributes.STREET_ADDRESS};
 cTextElements.push(obj);
 }else if (plyr.graphics.length > 1){
 if (xppins === ""){
 xppins = gra.attributes.PPIN;
 } else {
 if([7,16,25,34,43,52,61,70,79,88,97].indexOf(index) > -1){
 xppins = xppins + ",\r\n" + gra.attributes.PPIN;
 }else{
 xppins = xppins + ", " + gra.attributes.PPIN;
 }
 }
 obj = {OwnerName: "Selected PPINs: " + xppins};
 cTextElements.push(obj);
 }
 template.layoutOptions.customTextElements = cTextElements;
 }));
 }
//end my change

not sure what I can remove or keep.

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Rich,

    Remove it all and just use the new code.

0 Kudos
deleted-user-Z_OeT-WY_0pI
New Contributor II

Ok thanks do I keep template.showAttribution = false;

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

If you don't want to show the attribution.

0 Kudos
ÇankayaBelediyesi
New Contributor III

Robert,

var gra = this.map.infoWindow.getSelectedFeature();
var obj = {DistrictName: "District Name: " + gra.attributes.NAME};
cTextElements.push(obj);
template.layoutOptions.customTextElements = cTextElements;

I am guessing this change still requires layer to be found first? But in my situation, if I use print widget, layer is returned as "undefined" so that portion of the code is not reached. 

0 Kudos
ÇankayaBelediyesi
New Contributor III

Hello Robert,

Finally got it working. Thanks a lot for your time.

deleted-user-Z_OeT-WY_0pI
New Contributor II

I was wondering if you could share your final print.js script, When I add the code the print widget is just blank. Says there is a "unexpected identifier" syntax error

0 Kudos
ÇankayaBelediyesi
New Contributor III

Hello Rich,

//Hide map attribution
template.showAttribution = false;
//end my change

template.showLabels = form.showLabels && form.showLabels[0];
template.layoutOptions = {
  authorText: hasAuthorText ? form.author : "",
  copyrightText: hasCopyrightText ? (form.copyright || this._getMapAttribution()) : "",
  legendLayers: legendLayers,
  titleText: hasTitleText ? form.title : "",
  customTextElements: cteArray
};

// final edit
var cTextElements = [];
var gra = this.map.infoWindow.getSelectedFeature();
var obj = { TXT1: "Name: " + gra.attributes.NAME };
cTextElements.push(obj);
template.layoutOptions.customTextElements = cTextElements;
// edit end