0
I need to zoom in really close to a map designed with Leaflet and OpenStreetMap, and then take a screenshot of the map that includes and extends beyond the portion of the map that appears on my screen.
I know that I can use Google Map Saver to accomplish this with a Google map, but I don't know how to do this with a Leaflet/OpenStreetMap map. Any ideas?
user826233
Posted 2017-11-24T22:35:48.490
Reputation: 1
0
If the webpage were designed correctly you could just use Chrome or Firefox's zoom out feature and then take a screenshot within the browser which would record all the pixels rendered not just the ones getting to the screen. Unfortunately its not going to help you even if you used some other tool without editing the page itself.
You can test that this is not the fault of OSM by going here: http://www.openstreetmap.org/ and using Ctrl+- and seeing that more field of view is rendered when zooming out. And when looking at Leaflet here: http://leafletjs.com/examples/mobile/example.html it also behaves this way.
Therefor you will need to hack it to do what you want. Use your web browsers style editor and add the following:
html, body {
height: 100%;
}
#main_map {
height: 100vw;
width: 64.64vw;
}
then tick the zoom in and out on the leaflet UI then you can use the browsers zoom features.
jdwolf
Posted 2017-11-24T22:35:48.490
Reputation: 1 974
1If you're using an X-based system, then
xrandrwill create you a virtual desktop of any size that your memory allows. I often use this to create a screen-shot of an image that is bigger than my physical screen size, without the loss of detail that comes with scaling. – AFH – 2017-11-24T22:48:53.387Unfortunately I'm on Windows 7. . . . – user826233 – 2017-11-25T00:18:45.477
SnagIT can take screenshots larger than the screen. I’m sure there are other 3rd party tools that can do it. – Appleoddity – 2017-11-25T01:52:34.647
It helps to let us know your environment when you formulate a question. In general, an image larger than the screen which can be panned through by scrolling can be saved complete with Save Image As..., either by right-clicking or from Page Info in the Tools menu (Firefox). Unfortunately what OpenStreetMap displays is a series of tiles, which you would need to save individually, then piece together afterwards. – AFH – 2017-11-25T12:19:25.333
Note that OpenStreetMap's tiles at the borders of the scrolled area will be the full tiles for that part of the map, so the composite will be larger than the scrolled area. – AFH – 2017-11-25T12:49:57.223