Convert google maps into an image
19,779 views
Skip to first unread message
Geoff
Oct 19, 2011, 8:29:28 PM10/19/11
to Google Maps JavaScript API v3
Is there a way to convert the google maps object into a static image
(png, jpg, gif, etc.)? Specifically, I have a div holding a google
maps object with all my annotations and overlays, and I want to
generate a jpg from it. How do I do this?
(png, jpg, gif, etc.)? Specifically, I have a div holding a google
maps object with all my annotations and overlays, and I want to
generate a jpg from it. How do I do this?
davie strachan
Oct 20, 2011, 5:30:50 AM10/20/11
to Google Maps JavaScript API v3
Kesuke
Oct 20, 2011, 8:34:08 AM10/20/11
to Google Maps JavaScript API v3
>> Google Static Maps
But static maps won't work with custom overlays will it?
On Oct 20, 10:30 am, davie strachan <daviestrac...@gmail.com> wrote:
> Hi
> Google Static Mapshttp://code.google.com/apis/maps/documentation/staticmaps/
But static maps won't work with custom overlays will it?
On Oct 20, 10:30 am, davie strachan <daviestrac...@gmail.com> wrote:
> Hi
> Google Static Mapshttp://code.google.com/apis/maps/documentation/staticmaps/
Geoff
Oct 21, 2011, 3:14:05 AM10/21/11
to Google Maps JavaScript API v3
exactly my issue. i have a heatmap overlay on my map and i want to
export all that data into an image. currently, i'm using the static
maps api and programmatically merging a generated heatmap image on top
to produce the image i want. was wondering if there's an easier way
to do this.
export all that data into an image. currently, i'm using the static
maps api and programmatically merging a generated heatmap image on top
to produce the image i want. was wondering if there's an easier way
to do this.
Kesuke
Oct 21, 2011, 3:59:51 AM10/21/11
to Google Maps JavaScript API v3
I've been looking for about 2 years now for such a solution. The
problem is browsers deliberately lack a mechanism to selectively
'screencap' a <div> clientside - since that would be a security risk
(i.e. a great way to steal someones credit card details).This means
any solution will almost certainly involve a serverside script that
stitches your tiles together to form a new image and saves it.
I'd be interested to see your solution of programmatically merging
tiles into an image as have been considering this.
problem is browsers deliberately lack a mechanism to selectively
'screencap' a <div> clientside - since that would be a security risk
(i.e. a great way to steal someones credit card details).This means
any solution will almost certainly involve a serverside script that
stitches your tiles together to form a new image and saves it.
I'd be interested to see your solution of programmatically merging
tiles into an image as have been considering this.
Andrew C Leach
Oct 21, 2011, 4:51:53 AM10/21/11
to google-map...@googlegroups.com
On 21 October 2011 08:59, Kesuke <Nick_...@hotmail.com> wrote:
> This means
> any solution will almost certainly involve a serverside script that
> stitches your tiles together to form a new image and saves it.
> This means
> any solution will almost certainly involve a serverside script that
> stitches your tiles together to form a new image and saves it.
Can I suggest a cursory look at the Terms (particularly 10.1.3(a))
might be in order?
Kesuke
Oct 21, 2011, 5:30:15 AM10/21/11
to Google Maps JavaScript API v3
Sorry, as Andrew has pointed out, just to clarify the key word in that
was:
> > This means any solution will almost certainly involve a serverside
> > script that stitches YOUR tiles together to form a new image
> > and saves it.
Stitching the licensed tiles together, including if you have their map
layer with your own overlay, would obviously breach the ToS.
On Oct 21, 9:51 am, Andrew C Leach <andrew.le...@bcs.org> wrote:
was:
> > This means any solution will almost certainly involve a serverside
> > and saves it.
Stitching the licensed tiles together, including if you have their map
layer with your own overlay, would obviously breach the ToS.
On Oct 21, 9:51 am, Andrew C Leach <andrew.le...@bcs.org> wrote:
Trent
Oct 22, 2011, 4:11:32 AM10/22/11
to Google Maps JavaScript API v3
It might be worth checking out taking a "screenshot" of an area of
interest (the custom map on your page) using the HTML5 canvas and
javascript. I have been meaning to try this for another project. Check
out the following topic about doing this (answer #2):
http://stackoverflow.com/questions/60455/take-a-screenshot-of-a-webpage-with-javascript/4012915#6919676
There are also many other examples online. Not directly related to the
above example, the canvas screenshot concept basically involves the
following steps:
- Create a canvas element with the size and positioning of the area of
interest on the page
- Use the Canvas.toDataURL to generate a base64 encoded string of the
png image screenshot
- Send string to server via POST (depending on how large it is)
- Server creates image resource and returns link to user to download
As I said, I haven't tried this yet but please post whether it has
worked for your purpose.
Regards, Trent.
Southern Pacific Digital
interest (the custom map on your page) using the HTML5 canvas and
javascript. I have been meaning to try this for another project. Check
out the following topic about doing this (answer #2):
http://stackoverflow.com/questions/60455/take-a-screenshot-of-a-webpage-with-javascript/4012915#6919676
There are also many other examples online. Not directly related to the
above example, the canvas screenshot concept basically involves the
following steps:
- Create a canvas element with the size and positioning of the area of
interest on the page
- Use the Canvas.toDataURL to generate a base64 encoded string of the
png image screenshot
- Send string to server via POST (depending on how large it is)
- Server creates image resource and returns link to user to download
As I said, I haven't tried this yet but please post whether it has
worked for your purpose.
Regards, Trent.
Southern Pacific Digital
Reply all
Reply to author
Forward
Message has been deleted
0 new messages