I'm attempting to develop a function that will take a screenshot when an icon is clicked. I've found similar posts on GeoNet: https://community.esri.com/thread/211365-how-to-take-screenshot-in-javascript-for-arcgis-basemap-wit.... However, when following these instructions, I'm unable to successfully get a screen capture. My goal is to have a user click on a print icon within the application that I'm developing and then have the map "canvas" download as a PDF. I'm using ArcGIS API for JS 4.11.
Below is my relevant code....
First, I add the necessary modules:
require([
"esri/Map",
"esri/views/MapView",
"esri/Basemap",
"esri/layers/VectorTileLayer",
"esri/widgets/ScaleBar",
"esri/geometry/Point",
"esri/geometry/Extent",
"esri/core/watchUtils",
"esri/layers/MapImageLayer",
"esri/tasks/PrintTask",
"esri/tasks/support/PrintParameters",
"esri/tasks/support/PrintTemplate",
"esri/core/lang"
], function(Map, MapView, Basemap, VectorTileLayer, ScaleBar, Point, Extent, watchUtils, MapImageLayer, PrintTask, PrintParameters, PrintTemplate, lang) {
Then, I create the function where the user clicks on the print icon, which should then create the screenshot. Much of this is taken from the above article I referenced.
$(window).ready(function() {
$(".print_icon").click(function(){
var printTask = new PrintTask("https://devarcgisent.waynecounty.lan/serverdev/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task");
var template = new PrintTemplate();
template.exportOptions = {
width: 1500,
height: 700,
dpi: 200
};
template.format = "jpg";
template.layout = "MAP_ONLY";
template.preserveScale = false;
template.showAttribution = false;
var params = new PrintParameters();
params.map = this.map;
params.template = template;
printTask.execute(params, printResult);
function printResult(rsltURL){
var mapImg = domConstruct.toDom('<img src="'+rsltURL.url+'" border="0" style="width:1500px;height:700px;"/>');
domConstruct.place(mapImg, dom.byId("map_canvas"), "replace");
}
});
});
When I click on the print icon, I don't receive an error, but a screenshot is also not taken. I'm likely missing something in the code that I've written. Any help would be welcomed.
Solved! Go to Solution.
Paul,
In the 4.x API there is a method on the view for taking a screenshot:
https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html#takeScreenshot
Paul,
In the 4.x API there is a method on the view for taking a screenshot:
https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html#takeScreenshot
Thanks Robert, I wasn't aware of that method. I now have it working in my application. Thanks again!