HOW TO
Instructions provided describe how to customize the HTML Viewer print functionality in order to print as a larger size. The ArcIMS HTML viewer is designed to print maps on 8 1/2" x 11" paper; however, with a few modifications the viewer can be customized to output maps on larger sized paper.
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <HTML> <HEAD> <title>PrintForm</title> <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript"> var t; if (opener) { if (opener.name=="MapFrame") { t = opener.parent.MapFrame; } else { t = opener; } } else { if (parent.MapFrame) { t = parent.MapFrame; } else { t=document; } } function goPrint() { alert("Remember to set your print layout to Landscape if necessary before printing."); var theForm = document.forms[0]; var theTitle = theForm.title.value; // Get print size from form var theMapHeight = theForm.height.value; var theMapWidth = theForm.width.value; t.getPrintMap(theTitle, theMapWidth, theMapHeight); var useTextFrame = t.useTextFrame; t=null; if (opener) { window.close(); } else { if (useTextFrame) document.location = "text.htm"; } } //set the size of the print image function setPrintSize(s){ var mWidth = t.getMapWidth(); var mHeight = t.getMapHeight(); var w, h, r; r = mHeight/mWidth; switch(s) { case 'letter': w = 600; break; case 'tabloid': w = 1000; break; case 'dsize': w = 2200; break; case 'esize': w = 3000; break; default: w = 600; break; } // end switch h = w * r; document.thePrintForm.width.value = w; document.thePrintForm.height.value = Math.round(h); } // end function </SCRIPT> </HEAD> <BODY BGCOLOR="White" style="font-family:Arial,sans-serif; color:black"> <FORM onsubmit="goPrint();return false;" name="thePrintForm" ID="Form1"> <table style="font-size:smaller;" width="100%" ID="Table1"> <tr valign="top"> <td width="200"> <b>Print Map</b> <a href="PrintHelp.htm" target="_blank">Help</a><br> <font size="-2"> Click Create Print Page, then use the menu's File-Print to send the map to your printer. </font> </td> <td align="center"> Title to display on Map:<br> <INPUT TYPE="Text" NAME="title" VALUE="ArcIMS HTML Viewer Map" size="30" ID="Text1"> </td> <td valign="middle" align="center"> <INPUT TYPE="Submit" NAME="submit" VALUE="Create Print Page" ID="Submit1"> </td> </tr> <tr> <td colspan="2" align="center"> Size of Page: <INPUT name="mapSize" type="radio" value="latter" checked onClick="setPrintSize('letter');" ID="Radio1">11x8.5 <INPUT name="mapSize" type="radio" value="tabloid" onClick="setPrintSize('tabloid');" ID="Radio2">17x11 <INPUT name="mapSize" type="radio" value="dsize" onClick="setPrintSize('dsize');" ID="Radio3">D Size <INPUT name="mapSize" type="radio" value="esize" onClick="setPrintSize('esize');" ID="Radio4">E Size </td> <td colspan="2" align="center"> Map Width <INPUT NAME="width" VALUE="600" size="5" style="font-size:xx-small; background-color:#CCCCCC" ID="Text2"> Height <INPUT NAME="height" VALUE="450" size="5" style="font-size:xx-small; background-color:#CCCCCC" ID="Text3"> in pixels </td> </tr> </table> </form> </BODY> </HTML>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Printing Information</title> </head> <body bgcolor="#c0c0c0"> <div align="center"><form><input type="button" onclick="window.close()" value="Close"> </form>
Printing Information
To print, change the settings as desired in the print settings dialog, and click on "Create Print Page" to open a new browser window with the Map Image, Overview Map Image, and Legend displayed (your existing map page remains in the background). You can then use the browser's File/Print menu item to send the display to your printer.
Note: The geographical area covered by the printed map may be slightly larger than the area you are viewing. If the dimensions of the printed map are different from the viewed map, then one dimension (x or y) must be enlarged to include the currently viewed map extent. If you wish to change any settings after generating the print preview page, you will need to close the print page, return to the main mapping page and create a new print page.
Map Title
The map title you type will be displayed at the top of the printed page.
Print Size
You may choose a size from the options listed, or enter a size in terms of pixels. For larger map sizes, the map service must be configured to allow large map images. Contact the website administrator if you have problems printing large maps.
Note: The size is based on the standard 96 dpi in viewing the map. The actual map image produced will be adjusted based on the selected printer resolution dpi.
// aimsPrint.js /* * JavaScript template file for ArcIMS HTML Viewer * dependent on aimsXML.js, ArcIMSparam.js, aimsCommon.js, aimsMap.js, * aimsLayers.js, aimsDHTML.js * aimsClick.js, aimsNavigation.js, * aimsLegend.js */ var printDPI = 300; // BB: printer DPI--may be overridden by print form var printHeight = 0; // BB: default print dimensions var printWidth = 0; // BB var printScale = 0; // BB: RF scale (1:x number) for printing var INCH_TO_MAP_UNITS = 69 * 63360 // BB: inches in one map unit -- converts DPI to scale // NOTE that for decimal-degree map, scale is only correct in x or y // due to convergence of meridians toward the poles! aimsPrintPresent=true; var printTitle = titleList[4]; var printMapURL=""; var printOVURL=""; var printLegURL=""; var legVis2=false; //Print functions // display print form function printIt() { hideLayer("measureBox"); if (useTextFrame) { parent.TextFrame.document.location = "printform.htm"; } else { var Win1 = open("printform.htm","PrintFormWindow","width=575,height=150,scrollbars=yes,resizable=yes"); } } // create web page for printing // first get Map function getPrintMap(title, w, h) { var tLeft, tRight, tBottom, tTop; showRetrieveMap(); printTitle=title; legVis2=legendVisible; if (aimsLegendPresent) legendVisible=true; // BB: set print size to input values if (w != "") printWidth = parseInt(w); if (h != "") printHeight = parseInt(h); // BB: set map extent if scale specified tLeft = eLeft; tRight = eRight; tBottom = eBottom; tTop = eTop; //BB: set XMLMode so get print res. XMLMode = 101; // BB: enlarge legend in proportion to map var tempLegW = legWidth; var tempLegH = legHeight; legWidth = parseInt(printWidth/4); legHeight = parseInt(printWidth/3); if (printWidth == 1000){ legLayerfontsize=12; legSwatchheight=16; legSwatchwidth=20; } if (printWidth == 2200){ legLayerfontsize=14; legSwatchheight=18; legSwatchwidth=22; } if (printWidth == 3000){ legLayerfontsize=16; legSwatchheight=20; legSwatchwidth=24; } var theString = writeXML(); eLeft = tLeft; eRight = tRight; eBottom = tBottom; eTop = tTop; legWidth = tempLegW; // BB: restore default leg vars legHeight = tempLegH; // BB legendVisible = legVis2; sendToServer(imsURL,theString,101); theString=null; } // second, get OVMap function getPrintOV() { var tempWidth = i2Width; var tempHeight = i2Height; i2Width=parseInt(printWidth/4); //BB: scale to print i2Height=parseInt(printHeight/4); // BB: scale to print var tempDraw=drawOVExtentBox; drawOVExtentBox=true; XMLMode = 102; var theString = writeOVXML(); drawOVExtentBox=tempDraw; i2Width=tempWidth; i2Height = tempHeight; sendToServer(imsOVURL,theString,102); tempWidth=null; tempHeight=null; theString=null; } // third, get Legend function getPrintLegend() { if (printLegURL=="") printLegURL = "images/nolegend.gif"; writePrintPage(); } // fourth, write the web page function writePrintPage() { var Win1 = open("","PrintPage"); Win1.document.writeln('<html><meta http-equiv="Content-Type" content="text/html; charset=' + charSet + '"><head>'); Win1.document.writeln(' <title>' + titleList[5] + '</title>'); Win1.document.writeln('</head>'); Win1.document.writeln('<body BGCOLOR="White" TEXT="Black" LEFTMARGIN=0 TOPMARGIN=0>'); Win1.document.writeln('<FONT FACE="Arial"><B>'); Win1.document.writeln('<TABLE BORDER="3" CELLSPACING="0" CELLPADDING="0" NOWRAP>'); //BB: omit width Win1.document.writeln(' <TR>'); Win1.document.writeln(' <TH COLSPAN="2" style="font-size:' + parseInt(printWidth/20) + 'px">' + printTitle + '</TH>'); // BB: scale title Win1.document.writeln(' </TR>'); Win1.document.writeln(' <TR>'); Win1.document.write(' <TD'); if (hasOVMap) Win1.document.write(' ROWSPAN="2"'); Win1.document.writeln('>'); Win1.document.writeln(' <IMG SRC="' + printMapURL + '" WIDTH=' + printWidth + ' HEIGHT=' + printHeight + ' HSPACE=0 VSPACE=0 BORDER=0 ALT="Main map">'); //BB: set size Win1.document.writeln(' </TD>'); if (hasOVMap) { Win1.document.writeln(' <TD height="' + parseInt(printHeight/4) + '" valign="top">'); //BB: set size Win1.document.writeln(' <IMG SRC="' + printOVURL + '" WIDTH=' + parseInt(printWidth/4) + ' HEIGHT=' + parseInt(printHeight/4) + ' HSPACE=0 VSPACE=0 BORDER=0 ALT="Overview">'); // BB: set size Win1.document.writeln(' </TD>'); } Win1.document.writeln(' </TR>'); Win1.document.writeln(' <TR>'); Win1.document.writeln(' <TD ALIGN="CENTER" VALIGN="TOP">'); Win1.document.write(' <span style="font-size:' + parseInt(printWidth/40) + 'px">'); Win1.document.writeln(legTitle + '</span><br><br> '); // BB: add Legend title, set size Win1.document.write(' <IMG SRC="' + printLegURL + '" HSPACE=0 VSPACE=0 BORDER=0 ALT="Legend"'); Win1.document.writeln(' width="' + parseInt(printWidth/4) + '" >'); // BB: set size Win1.document.writeln(' </TD>'); Win1.document.writeln(' </TR>'); Win1.document.writeln('</TABLE>'); Win1.document.writeln('</B></FONT>'); Win1.document.writeln('</body></html>'); Win1.document.close(); legendVisible=legVis2; Win1=null; hideRetrieveMap(); printWidth = 0; printScale = 0; }
function writeXML() { var theString = '<ARCXML version="1.1">\n<REQUEST>\n<GET_IMAGE>\n<PROPERTIES>\n<ENVELOPE minx="' + forceComma(eLeft) + '" miny="' + forceComma(eBottom) + '" maxx="' + forceComma(eRight) + '" maxy="' + forceComma(eTop) + '" />\n'; theString += '<IMAGESIZE height="' + iHeight + '" width="' + iWidth + '" />\n';
with the following code:
function writeXML() { var theString = '<ARCXML version="1.1">\n<REQUEST>\n<GET_IMAGE>\n<PROPERTIES>\n<ENVELOPE minx="' + forceComma(eLeft) + '" miny="' + forceComma(eBottom) + '" maxx="' + forceComma(eRight) + '" maxy="' + forceComma(eTop) + '" />\n'; //verify if we are doing custom print if ( printWidth != 0 && printHeight != 0){ printDPI = 96*(printHeight/iHeight) theString += '<IMAGESIZE height="' + printHeight + '" width="' + printWidth + '" dpi="' + printDPI + '" />'; } else { theString += '<IMAGESIZE height="' + iHeight + '" width="' + iWidth + '" />'; }
// add Legend to XML request function addLegendToMap() { var legString = '<LEGEND title="' + legTitle + '" font="' + legFont + '" width="' + legWidth + '" height="' + legHeight + '" '; legString += 'layerfontsize="'+legLayerfontsize+'" swatchheight="'+legSwatchheight+'" swatchwidth="'+legSwatchwidth+'" '; legString += 'autoextend="true" backgroundcolor="255,255,255"'; if (hideLayersFromList) { legString += '>\n<LAYERS>\n'; for (var legvar=0;legvar<noListLayer.length;legvar++) { if (noListLayer[legvar]) legString += '<LAYER id="' + LayerID[legvar] + '" />\n'; } legString += '</LAYERS>\n'; legString += '</LEGEND>\n'; } else { legString += ' />\n'; } if (drawLegendOnly) legString = legString + '<DRAW map="false" />\n'; return legString; }
Identify the following code:
// legend map size var legWidth=170; var legHeight=300; var legFont="Arial"; var legTitle="Legend";
and replace the code with the code below:
// legend map size var legWidth=170; var legHeight=300; var legFont="Arial"; var legTitle="Legend"; var legLayerfontsize=10; var legSwatchheight=14; var legSwatchwidth=18;
Get help from ArcGIS experts
Download the Esri Support App