We would like to write a javascript code to save a map (with layers) as an image file. We do not have desktop, but have an AGOL account. The help community points at utility.arcgis.com (printing - Setting up ArcGIS Print service for ArcGIS Online account? - Geographic Information Systems Stack Exchange). Can anyone give us more pointers on how to exactly use the utility.arcgis.com's print service? Thank you
Shawn,
Sampleserver6 is a publicly accessible server. You do not need your own.
Thanks but I do not have the server installed. I have to try replacing " 'http://sampleserver6.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export Web Map Task'" with the utility.arcgis.com link.
You can create an image client-side using HTML canvas. See this project: GitHub - WSDOT-GIS/arcgis-map-thumbnail-builder: Exports an image of an ArcGIS API for JavaScript map.
Here is some code snippet I use for that:
<SPAN class="comment token">//Requires needed</SPAN> <SPAN class="string token">'esri/tasks/PrintTemplate'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'esri/tasks/PrintParameters'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'esri/tasks/PrintTask'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'dojo/_base/lang'</SPAN> PrintTemplate<SPAN class="punctuation token">,</SPAN> PrintParameters<SPAN class="punctuation token">,</SPAN> PrintTask<SPAN class="punctuation token">,</SPAN> lang <SPAN class="keyword token">var</SPAN> printTask <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">PrintTask</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token"><SPAN>'</SPAN><A class="jive-link-external-small" href="https://community.esri.com/external-link.jspa?url=http%3A%2F%2Fsampleserver6.arcgisonline.com%2Farcgis%2Frest%2Fservices%2FUtilities%2FPrintingTools%2FGPServer%2FExport" target="_blank">http://sampleserver6.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export</A><SPAN> Web Map Task'</SPAN></SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">var</SPAN> template <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">PrintTemplate</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="comment token">//code to calculate and maintain images aspect ratio</SPAN> <SPAN class="keyword token">var</SPAN> oWid <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>map<SPAN class="punctuation token">.</SPAN>width<SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">var</SPAN> oHgt <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>map<SPAN class="punctuation token">.</SPAN>height<SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>imgHeight <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="number token">740</SPAN><SPAN class="operator token">/</SPAN>oWid<SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">*</SPAN> oHgt<SPAN class="punctuation token">;</SPAN> template<SPAN class="punctuation token">.</SPAN>exportOptions <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">{</SPAN> width<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">1542</SPAN><SPAN class="punctuation token">,</SPAN> height<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="number token">1542</SPAN><SPAN class="operator token">/</SPAN>oWid<SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">*</SPAN> oHgt<SPAN class="punctuation token">,</SPAN> dpi<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">200</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">;</SPAN> template<SPAN class="punctuation token">.</SPAN>format <SPAN class="operator token">=</SPAN> <SPAN class="string token">"jpg"</SPAN><SPAN class="punctuation token">;</SPAN> template<SPAN class="punctuation token">.</SPAN>layout <SPAN class="operator token">=</SPAN> <SPAN class="string token">"MAP_ONLY"</SPAN><SPAN class="punctuation token">;</SPAN> template<SPAN class="punctuation token">.</SPAN>preserveScale <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">false</SPAN><SPAN class="punctuation token">;</SPAN> template<SPAN class="punctuation token">.</SPAN>showAttribution <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">false</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">var</SPAN> params <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">PrintParameters</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> params<SPAN class="punctuation token">.</SPAN>map <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>map<SPAN class="punctuation token">;</SPAN> params<SPAN class="punctuation token">.</SPAN>template <SPAN class="operator token">=</SPAN> template<SPAN class="punctuation token">;</SPAN> printTask<SPAN class="punctuation token">.</SPAN><SPAN class="token function">execute</SPAN><SPAN class="punctuation token">(</SPAN>params<SPAN class="punctuation token">,</SPAN> lang<SPAN class="punctuation token">.</SPAN><SPAN class="token function">hitch</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>printResult<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">function</SPAN> <SPAN class="token function">printResult</SPAN><SPAN class="punctuation token">(</SPAN>rsltURL<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN> console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">info</SPAN><SPAN class="punctuation token">(</SPAN>rsltURL<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
Signed in members can post, follow updates, and more. New here? Register a free account.
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.