Select to view content in your preferred language

Screenshot widget 1.0

5576
7
06-16-2015 10:22 AM
by Anonymous User
Not applicable

Screenshot widget 1.0

This widget is designed to take a screenshot of the entire viewport of the WebApp window. Widgets and all. It then prompts the user to open or save it as an image file. Note: this wdget requires PHP.

Screenshot widget at kevinsagis/ScreenshotDemo · GitHub

Widget demo at:  ArcGIS Web Application

Why is Screenshot useful? Maybe your users want to see "exactly what you are seeing" which was my user request. This is powered by html2canvas, canvas to blob, and filesaver.js, Credits in documentation.

Status: 1.0 beta 1 --    Screenshot works now, as in this link. Note sometimes minor graphical oddities like the button's CSS but these limitations are well explained by the html2canvas author Niklas. Also, minor caveat, at small-scale levels, i.e. zoomed out farther than 20,000, sometimes esri basemap tiles will not load. this appears to be a caveat with html2canvas and sporadic. Report results back. For our purposes this widget now works great!  I may turn it into a 'feedback' widget in the future.

I am using this proxy:   brcontainer/html2canvas-php-proxy · GitHub

Note as this uses PHP. There are also Python and ASP.NET proxies. These do not work inside WebApp Builder! WebApp Builder runs on node.js.  PHP will run inside node.js but only after you install some other libraries.  The simple solution I elected to follow is to put this widget into your application after Downloading it out of WebApp Builder, and tweak it after downloading, if desired.

0 Kudos
7 Replies
RebeccaStrauch__GISP
MVP Emeritus

Kevin, I updated the link​ in the resource list.

DanielStoelb
Frequent Contributor

Don't know if I'm missing something, but it appears that the screenshot widget demo is not working.  I click the button and nothing is happening.

0 Kudos
RickeyFight
MVP Regular Contributor

I am using Chrome and it does not work for me either

0 Kudos
by Anonymous User
Not applicable

Thank you both for testing this Widget.  Can you try downloading the source from Git and running it locally? Also give the demo a try again. I updated it with the files from Git which might have been slightly newer.

For me what I've noticed is that the Demo link should work, except that ESRI basemap tiles won't load. This happens to me too.  I worked on it for a bit to no avail, tried adjusting timings etc.  But... interestingly enough, the widget works perfectly fine with esri basemap tiles on the site I'm using this widget for that is hosted on an internal server. So I left it for now. 

But if you download the project from Git it should work, including basemap tiles. If you can give it a go and report findings that would be great!  I will come back and refine this at some point and perhaps take a second look at the basemap thing as well.

0 Kudos
DanielStoelb
Frequent Contributor

Kevin,

I was able to download and plug into my application, but pressing the "Save Screenshot" button does nothing.  I modified the url in the widget.js file, but it still isn't working.

0 Kudos
by Anonymous User
Not applicable

Hi Daniel Stoelb​ can you post a link to it? I'll take a look at the source. Thanks!

0 Kudos
DanielStoelb
Frequent Contributor

I can PM you the link.

0 Kudos