Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium


Google Maps info window defaults

Posted on 2011-10-19
Medium Priority
Last Modified: 2012-05-12
Can anyone help me configure the script creating this Google Map to have the info window open by default?
The info window is currently activated when clicking on the polygon
Question by:Neil_Bradley
LVL 83

Accepted Solution

leakim971 earned 1000 total points
ID: 36997542
add this :
	var e = { latLng:new google.maps.LatLng(-41.753706, 173.887739) };
	google.maps.event.trigger(Ballochdale, 'click', e);

Open in new window

after :
    infowindow = new google.maps.InfoWindow();

Open in new window

<!DOCTYPE html>
<html lang="en">
    <meta charset="utf-8" />
    <title>Google Maps JavaScript API Example: Ground Overlays</title>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
              <script type="text/javascript">

  var map;
  var infoWindow;

  function initialize() {
    var myLatLng = new google.maps.LatLng(-41.753706, 173.887739);
    var myOptions = {
      zoom: 13,
      center: myLatLng,
      mapTypeId: google.maps.MapTypeId.SATELLITE

    var bermudaTriangle;

    map = new google.maps.Map(document.getElementById("map_canvas"),

    var Coords = [
	    new google.maps.LatLng(-41.748727, 173.878212),
        new google.maps.LatLng(-41.749551, 173.878105),
        new google.maps.LatLng(-41.750600, 173.881463),
        new google.maps.LatLng(-41.751496, 173.881774), 
		new google.maps.LatLng(-41.752978, 173.884606),
		new google.maps.LatLng(-41.752850, 173.885465),
		new google.maps.LatLng(-41.754074, 173.887117),
		new google.maps.LatLng(-41.755027, 173.887095),
		new google.maps.LatLng(-41.756307, 173.888040),
		new google.maps.LatLng(-41.757204, 173.888083),
		new google.maps.LatLng(-41.757579, 173.888748),
		new google.maps.LatLng(-41.757940, 173.890572),
		new google.maps.LatLng(-41.758804, 173.891473),
		new google.maps.LatLng(-41.758860, 173.891827),
		new google.maps.LatLng(-41.757996, 173.891999),
		new google.maps.LatLng(-41.757667, 173.892310),
		new google.maps.LatLng(-41.757355, 173.892471),
		new google.maps.LatLng(-41.756955, 173.893189),
		new google.maps.LatLng(-41.756435, 173.893206),
		new google.maps.LatLng(-41.754538, 173.892336),
		new google.maps.LatLng(-41.754506, 173.891832),
		new google.maps.LatLng(-41.753906, 173.890657),
		new google.maps.LatLng(-41.754062, 173.889633),
		new google.maps.LatLng(-41.753970, 173.889016),
		new google.maps.LatLng(-41.753357, 173.888855),
		new google.maps.LatLng(-41.752361, 173.887439),
		new google.maps.LatLng(-41.750993, 173.886709),
		new google.maps.LatLng(-41.749455, 173.881516),
		new google.maps.LatLng(-41.749407, 173.880572),
		new google.maps.LatLng(-41.749311, 173.880197),
		new google.maps.LatLng(-41.749255, 173.879671)

    Ballochdale = new google.maps.Polygon({
      paths: Coords,
      strokeColor: "#FEFEFE",
      strokeOpacity: 0.8,
      strokeWeight: 2,
      fillColor: "#919192",
      fillOpacity: 0.25

    // Add a listener for the click event
    google.maps.event.addListener(Ballochdale, 'click', showArrays);
    infowindow = new google.maps.InfoWindow();
	var e = { latLng:new google.maps.LatLng(-41.753706, 173.887739) };
	google.maps.event.trigger(Ballochdale, 'click', e);

  function showArrays(event) {

  // Since this Polygon only has one path, we can call getPath()
    // to return the MVCArray of LatLngs
    var vertices = this.getPath();

    var contentString = '<div style="width:240px"><img src="http://gromit.utopia.co.nz/~ballochd/images/base/map-logo.gif" width="232" height="71"><\/div>';

    // Replace our Info Window's content and position


  <body onLoad="initialize()">
   <div id="map_canvas" style="width: 800px; height: 600px"></div>

Open in new window


Author Closing Comment

ID: 36997565
That's got it. Thanks for the quick reply.

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

This article discusses how to implement server side field validation and display customized error messages to the client.
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

578 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