How to print Google Map markers

Question

I am using Google Map Version 3 API to add markers on Google Map.

The problem is that, markers show up on browsers.
but when users print the map through browser's print command, nothing shows up.

The question is, - How can I display markers on printed materials? -

Comparisons:

@hsz: same result. Since default didn't work, i tried custom marker — dance2die, Sep 16 '10 at 21:07
The reason they don't print is because the markers are div elements with `background-image:url('your_marker');` - you/your user has background image printing turned off. Looking for a solution myself. — JP., Sep 30 '10 at 15:49

score 4 · Accepted Answer · edited May 23 '17 at 12:19

4

I suggest you try out the Static Maps API. You can build a url that will return a static image (you can build your custom markers into the URL).

The browser will do a much better job of printing an image than it will do with a dynamic Google map.

edited May 23 '17 at 12:19

Community

answered Sep 17 '10 at 02:52

RedBlueThing

Unfortunately, when I construct static map URL, URL becames too long to be processed. – dance2die Sep 17 '10 at 14:23
That is unfortunate. Static Maps has a maximum URL length of 2048 characters. The docs mention that you should check you are encoding the URL correctly. http://code.google.com/apis/maps/documentation/webservices/index.html#BuildingURLs Maybe worth checking. Good luck. – RedBlueThing Sep 17 '10 at 23:52

score 1 · Answer 2 · answered Apr 05 '13 at 19:51

1

I was able to print markers by using MarkerWithLabel in place of Google's Marker class which uses images in place of canvas.

answered Apr 05 '13 at 19:51

eightdotthree

score 1 · Answer 3 · edited May 23 '17 at 12:19

1

In my print dialog there is a checkbox "print background images". When I enable it, the markers are printed. This link can help you: How can I force browsers to print background images in CSS?

edited May 23 '17 at 12:19

Community

answered Dec 03 '14 at 11:39

ropo

score 0 · Answer 4 · answered Jan 07 '15 at 08:26

0

Please find the link given below:

Using this you will be able to print Google Map along with custom markers.

You only need to make a change at line number 17. Replace container.clone(); with $(container).clone();

answered Jan 07 '15 at 08:26

Munish Dhiman

Could you give some insight in how to use this? – Luke Pittman Jun 10 '15 at 17:28

score 0 · Answer 5 · answered Dec 17 '10 at 15:27

0

I had no issue with printing the markers. I've created my own markers and I use an <IMG> tag to stick the marker icon in.

The markers print fine on IE 8 on default settings.

answered Dec 17 '10 at 15:27

R4cOOn

Due to the printing issue, i deserted Google map over Bing map (silverlight version), which works fabulously well – dance2die Dec 22 '10 at 14:36
I tried this but not working. Can you please include a code sample? – Zusee Weekin Mar 14 '16 at 02:16

5 Answers5