One thing that really annoys me on Google Maps is that even tough I remove the info tooltip when placing a map on a website, most of the times the tooltip insists on showing.
This can be a real time waster when your client doesn’t demand for anything complicated, just wants a certain personalization to the location map you are adding on their website.
On this tutorial I’ll teach you how to remove that annoying Info Window that most of the times insists on being opened.
Fortunately I was able to easily understand that the tooltip is called by using a variable named iwloc which is used to specify where the infowindow A.K.A info bubble, info ballon or info tooltip.
You can read more about the iwloc variable and it’s properties at mapki wiki about Google Map Parameters on the Info Windows Section
Important Note:
Two days after writing this post I was unable to view the Info Window (info ballon) when the page is loaded. If you wish to know what the Info Window is, left click on top of any pinpoint and it will show.
Here is an example of what I mean:
You can imagine why clients wouldn’t want this info window showing up on a map at their website. But unfortunately removing this info window is not as simple as removing the iwloc var from the code google maps gives you to embed the map on your website.
Here is the code that shows the map above:
<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=google+headquarters&sll=37.42285,-122.080078&sspn=0.008043,0.01929&ie=UTF8&radius=0.53&filter=0&rq=1&ev=p&t=h&cid=5377921459564608739&ll=37.431251,-122.076902&spn=0.023855,0.036478&z=14&iwloc=A&output=embed"></iframe><br /><small><a href="http://maps.google.com/maps?f=q&source=embed&hl=en&geocode=&q=google+headquarters&sll=37.42285,-122.080078&sspn=0.008043,0.01929&ie=UTF8&radius=0.53&filter=0&rq=1&ev=p&t=h&cid=5377921459564608739&ll=37.431251,-122.076902&spn=0.023855,0.036478&z=14&iwloc=A" style="color:#0000FF;text-align:left">View Larger Map</a></small>
I highlight the iwloc variable but now if I remove it. Here is what I get:
Here is the code I used to show the map above:
<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=google+headquarters&sll=37.42285,-122.080078&sspn=0.008043,0.01929&ie=UTF8&radius=0.53&filter=0&rq=1&ev=p&t=h&cid=5377921459564608739&ll=37.431251,-122.076902&spn=0.023855,0.036478&z=14&&output=embed"></iframe><br /><small><a href="http://maps.google.com/maps?f=q&source=embed&hl=en&geocode=&q=google+headquarters&sll=37.42285,-122.080078&sspn=0.008043,0.01929&ie=UTF8&radius=0.53&filter=0&rq=1&ev=p&t=h&cid=5377921459564608739&ll=37.431251,-122.076902&spn=0.023855,0.036478&z=14&" style="color:#0000FF;text-align:left">View Larger Map</a></small>
I removed the iwloc variable and I noticed this works on some maps, on others you have to endorse other strategies.
After reading the Google Map Paremeters information about the iwloc variable I started trying the different values you can apply and I found that using iwloc=near; does what I want: The map shows up with the pinpoint and no Info Window, if I click on the pinpoint the Info Windows shows up. Perfect!
Here is the code I used to create the map you see above:
<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=google+headquarters&sll=37.42285,-122.080078&sspn=0.008043,0.01929&ie=UTF8&radius=0.53&filter=0&rq=1&ev=p&t=h&cid=5377921459564608739&ll=37.431251,-122.076902&spn=0.023855,0.036478&z=14&iwloc=near&output=embed"></iframe><br /><small><a href="http://maps.google.com/maps?f=q&source=embed&hl=en&geocode=&q=google+headquarters&sll=37.42285,-122.080078&sspn=0.008043,0.01929&ie=UTF8&radius=0.53&filter=0&rq=1&ev=p&t=h&cid=5377921459564608739&ll=37.431251,-122.076902&spn=0.023855,0.036478&z=14&iwloc=near" style="color:#0000FF;text-align:left">View Larger Map</a></small>
And voilá! Just don’t forget when applying a Map make sure on Google Maps you right click and set the map to center on that spot by clicking on Center Map Here:
The Final Result:
Lincoln Plumber
2 de October de 2009 at 11:15
Great tip (excuse the pun). I will try it out on my next Google Map addition.