topic Re: Printing issue with graphics layer and legend in ArcGIS JavaScript Maps SDK Questions

Printing issue with graphics layer and legend

JamesTanis — Tue, 11 May 2010 19:46:10 GMT

I am having some weird behavior with the print page. First, I am using ESRI's street maps as my base layer then I have a graphics layer on top of along with a legend. The problems that I am having are if I am zoomed out to the state level and launch the print page the base map is pu into four tiles down the page, while the graphics layer is centered in the page and not in the correct location and the legend does not show up (Picture 1). Second, if I am zoomed into the a county or tract I have the same problem but this time there are less tiles for the base map and the legend shows up but with no background (Picture 2). Fianlly, if you use firefox the graphics layer or the lengend never show up in the print page. Any help would be greatly appreciated.

function clickheretoprint(divId, title, right, top, w, h) {

    if (right == null) right = 100;
    if (top == null) top = 25;
    if (w == null) w = 1000;
    if (h == null) h = 1000;
    if (title == null) title = "Print Screen";

    var disp_setting = "toolbar=yes,location=no,directories=yes,menubar=yes,";
    disp_setting += "scrollbars=yes,width=" + w + ", height=" + h + ", right=" + right + ", top=" + top;

    //get the html of the div
    var content_vlue = dojo.byId('mapDiv').innerHTML;
    //strip out the link tags else we'll link back to the mapper page
    content_vlue = content_vlue.replace(/<a/g, "<span");
    content_vlue = content_vlue.replace(/<\/a/g, "</span");

    var docprint = window.open("", "", disp_setting);
    docprint.document.open();
    docprint.document.write('<html><head><title>' + title + '</title>');
    docprint.document.write('<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.6"></script>');
    docprint.document.write('</head><body onLoad="self.print()"><left>');
    docprint.document.write('<div id="position" style="position:absolute;margin-left:50px;margin-top:50px;">');
    docprint.document.write(content_vlue);
    docprint.document.write('</left></body></html>');
    docprint.document.close();
    docprint.focus();
}

Re: Printing issue with graphics layer and legend

JamesTanis — Thu, 13 May 2010 18:50:13 GMT

I was finalyl able to get the print page to work. My next problem is I want the user to be able to right click the print page and be able to save it as an image. Currently though if the user does that it creates a seperate image for each tile, graphics layer, and legend.

Re: Printing issue with graphics layer and legend

JoseMachado — Mon, 16 Aug 2010 16:43:17 GMT

I was finalyl able to get the print page to work. My next problem is I want the user to be able to right click the print page and be able to save it as an image. Currently though if the user does that it creates a seperate image for each tile, graphics layer, and legend.

Hi, How did you managed to print the map correctly?
Thanks in advance,
JM

Re: Printing issue with graphics layer and legend

AleksandrasKapitanovas — Wed, 18 Aug 2010 05:37:48 GMT

Most likely he fixed this by forcing IE7 document mode:

<meta http-equiv="X-UA-Compatible" content="IE=7" />

Re: Printing issue with graphics layer and legend

JamesTanis — Wed, 18 Aug 2010 14:45:08 GMT

Hi, How did you managed to print the map correctly?
Thanks in advance,
JM

Here is some code that I was using that fixed some of my issues. I could never get to correctly work in Firefox the SVG tags are all messed up using innerHTML. What I finally did was just create a print CSS.

function clickheretoprint(divId, title, right, top, w, h) {

    if (right == null) right = 100;
    if (top == null) top = 25;
    if (w == null) w = 1000;
    if (h == null) h = 1000;
    if (title == null) title = "Print Screen";

    var disp_setting = "toolbar=yes,location=no,directories=yes,menubar=yes,";
    disp_setting += "scrollbars=yes,width=" + w + ", height=" + h + ", right=" + right + ", top=" + top;

    //get the html of the div
    var content_vlue = document.getElementById('print2').innerHTML;
    //window.alert(content_vlue);
    //strip out the link tags else we'll link back to the mapper page
    content_vlue = content_vlue.replace(/<a/g, "<span");
    content_vlue = content_vlue.replace(/<\/a/g, "</span");
    content_vlue = content_vlue.replace(/svg/, "svg:svg");

   // var html = '<html><head><style type="text\/css">\n' +
     //          'body,html { text-align: center; margin-top:50px; margin-left:50px; }\n' +
       //        '<\/style><\/head><body>\n' + content_vlue +
         //      '<form><input type="button" onClick="window.close();" value="Close Window"><\/form>\n' +
           //    '<\/body><\/html>';

    var docprint = window.open("", "", disp_setting);
    docprint.document.open();
    // docprint.document.write(html);
    // docprint.document.write('<?xml version="1.1" standalone="no"?> \n');
    // docprint.document.write('<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> \n');
    docprint.document.write('<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">');
    docprint.document.write('<html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">');

    docprint.document.write('<head><title>' + title + '</title> ');
    docprint.document.write('<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.6"></script>');
    docprint.document.write('</head><body onLoad="$(\'print2\').innerHTML = \'' + content_vlue + '\'; self.print()"><div>');
    docprint.document.write('<div id="position" style="position:absolute;margin-left:50px;margin-top:50px;">');
    docprint.document.write(content_vlue);
    docprint.document.write('</div></body></html>');

Re: Printing issue with graphics layer and legend

ViktoriaMagnis — Tue, 28 Sep 2010 15:26:15 GMT

Hi

I am trying to use the same code, but I am running into two problems

1) the esri street service is mis-aligned
2) I can not get the map to be smaller in the print page

Thanks

Vicki

Re: Printing issue with graphics layer and legend

BenSayers — Wed, 29 Sep 2010 15:33:40 GMT

Hello,
I am trying to make a quick print page, or a page that simply shows the current map view with the relevant layers switched on and at the correct zoom level, or ideally a PDF.

Can anyone here help me at all?

I have looked at the Map2PDF and am unable to get this working. I have also followed what has been posted here and I get an HTML page with tiles all over the place.

Can anyone post a quick dump of a print.css? Or anything useful at all.

Many

Re: Printing issue with graphics layer and legend

DeminHu — Thu, 30 Sep 2010 13:13:34 GMT

1. Create a usercontrol for printing or print preview, in this control, desgin your layout, you can put map, legend, whatever in this control
2. use PrintDocument, PageVisual etc.

It works fine for me. Hope the following link could help you a little:

http://www.markusegger.com/blog/Development.aspx?messageid=30f65164-2185-49d8-b65a-4ddd8c2e1380

Re: Printing issue with graphics layer and legend

MikeMartin — Thu, 30 Sep 2010 16:53:50 GMT

Hello,
I am trying to make a quick print page, or a page that simply shows the current map view with the relevant layers switched on and at the correct zoom level, or ideally a PDF.

Can anyone here help me at all?

I have looked at the Map2PDF and am unable to get this working. I have also followed what has been posted here and I get an HTML page with tiles all over the place.

Can anyone post a quick dump of a print.css? Or anything useful at all.

Many

I found this to work (so far) with the 2.1 api:
        function printscreen(text) {
             text = document
             print(text)
             }

It creates a print screen of the map with all layers (cached and dynamic) and graphics. It does not work with the 1.6 api.

Re: Printing issue with graphics layer and legend

Todd — Thu, 04 Nov 2010 16:30:58 GMT

Exploring the Map2PF also...

Curious about the new 2.1 and if you have any sample code written for this using the 2.1 you'd share? and did you use one namespace (pointing to 2.1) or two+ ?

thanks!

Re: Printing issue with graphics layer and legend

MikeMartin — Mon, 08 Nov 2010 09:51:31 GMT

Exploring the Map2PF also...

Curious about the new 2.1 and if you have any sample code written for this using the 2.1 you'd share? and did you use one namespace (pointing to 2.1) or two+ ?

thanks!

All I have is a button that fires the function above. Re. 2.1 namespace, my only references to the api are the script
<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.1"></script> and the css
<style type="text/css"> @import "http://serverapi.arcgisonline.com/jsapi/arcgis/2.1/js/dojo/dijit/themes/tundra/tundra.css";

Hope that answers your question, I'm not an expert at this stuff by any means.

Re: Printing issue with graphics layer and legend

anwarawad — Tue, 14 Dec 2010 09:54:43 GMT

dear mmartin
would you plzzzz send me a code snipit showing the complete block of code involved with your function you posted that works with 2.1v ??

ill be soooo thankful

am trying to print a map with charts on it , which are picture markers
i used the print function mentioned before in the thread but i only can se the graphics on the screen, but not on the printout paper

could you plzzz help ?? its urgent

regards to all

Re: Printing issue with graphics layer and legend

GlenRhea — Tue, 14 Dec 2010 19:27:01 GMT

text = document
print(text)

This doesn't work when you're creating the page dynamically. Still searching for a halfway decent (and simple) way to print using a js viewer.

Glen

Re: Printing issue with graphics layer and legend

Todd — Tue, 14 Dec 2010 20:40:48 GMT

For printing with JSAPI make sure you check out the Image Blender utility.

Re: Printing issue with graphics layer and legend

anwarawad — Wed, 15 Dec 2010 08:01:20 GMT

hii

i want to creat a layout page and add the map to that layout with the graphics on it
that layout is printable ,, soo is the image blender is the best choice for that scenario ??
or can i do somethin else ???

thanx for replying

Re: Printing issue with graphics layer and legend

MikeMartin — Wed, 15 Dec 2010 10:06:50 GMT

dear mmartin
would you plzzzz send me a code snipit showing the complete block of code involved with your function you posted that works with 2.1v ??

ill be soooo thankful

am trying to print a map with charts on it , which are picture markers
i used the print function mentioned before in the thread but i only can se the graphics on the screen, but not on the printout paper

could you plzzz help ?? its urgent

regards to all

The function itself is
[INDENT]function printscreen(text) {
[INDENT]text = document
print(text)
[/INDENT]}[/INDENT]

In the <body> I have
<button dojoType="dijit.form.Button" onClick="printscreen()">Print Map</button>

That's it. An example of a result is attached, showing a graphics layer, a dynamic layer, a tiled layer, and an info window.

Mike

Re: Printing issue with graphics layer and legend

anwarawad — Wed, 15 Dec 2010 10:33:27 GMT

hi

thanx alot for the help ,,