[Last Call] Learn how to a build a cloud-first strategyRegister Now


Google Map Maker Info Bubble Size

Posted on 2012-09-13
Medium Priority
Last Modified: 2012-09-20
Here is the problem.

I am revamping my companies webpage, I do not have ANY experince coding, doing web design, or really anything outside of the Microsoft Office Suite and Google Apps.

I have a map that I made using Google Map Maker embeded into a webpage. This works fine, the issue is that when you click on the Google Map Maker Marker (which pin-points one of our office locations) the info bubble that opens fills the whole map.

I do not want to change the size of the map, I want the info bubble to open, but I want it to be smaller, or if this is not possible I want it to show a sigle line of text when the curser is moved over the marker so that the rest of the map is still visible and can be scrolled through.

Here is a link to the page.  


Thanks in advance!
Question by:Confusedwebdesigner
LVL 111

Expert Comment

by:Ray Paseur
ID: 38399510
You may not be able to control the bubble size -- that comes from Google.  But here is an alternative suggestion.  You can use the Google "static maps" facility to make an appropriately sized map.  Let that small static map be a link to another page in your site that shows a larger, clickable Google map.  You will get the same bubble functionality on the larger map, and it won't be obtrusive in the larger context.
LVL 38

Accepted Solution

Tom Beck earned 1500 total points
ID: 38399735
Very similar to @Ray_Paseur's suggestion however instead of another page, you could load the larger map in a modal popup. Here's a site that does that.

If you want to keep it the way you have it you can set the maxWidth of an infowindow but I think the height will always be whatever the content requires.

Also, you can use something like:
map.panTo(new google.maps.LatLng(40.623395,-74.764431));
when the user clicks the marker. This will re-center the map to your new coordinates so the infowindow is visible. The site above uses this.

Lastly, you can use a third party plugin like infobox to create a fully customizable small format boxe for information associated with the marker on your map.

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Adults who share images on social media aren’t the only ones who need to worry about their privacy. Our culture’s tendency to share every move and celebration affects the privacy of our children, too.
Dramatic changes are revolutionizing how we build and use technology. Every company is automating, digitizing, and modernizing operations. We need a better, more connected way to work together as teams so we can harness the insights from our system…
It is a freely distributed piece of software for such tasks as photo retouching, image composition and image authoring. It works on many operating systems, in many languages.
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.
Suggested Courses
Course of the Month18 days, 12 hours left to enroll

834 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question