How auto open infoWindow in gmaps v0.3

Question

I have a problem about gmaps v0.3 that when I addMarker How let infoWindow auto open. not when you onclick open.

<script type="text/javascript">
var map;
$(document).ready(function(){
    map = new GMaps({
        div: '#map',
        lat: 39.908403,
        lng: 116.397529,
        zoom: 1,
    });
    var marker = new google.maps.Marker();
    marker = {
        lat: 39.908403,
        lng: 116.397529,
        title: 'Lima',
        //map: map.map,
        //animation: google.maps.Animation.BOUNCE,
        //shape: {coords: [0,0,50,50], type: "rect"},
        infoWindow: {
          content: '<font color="red">hello world</font>'
        }
    }
    map.addMarker(marker);
 });

I want to when addMarker auto open infoWindow not click, what should I do. please help me.

Solution 1

You can open the infoWindow by using the .open function:

// Create map
var map = new GMaps({
    div: '#map',
    lat: 39.908403,
    lng: 116.397529,
    zoom: 1,
});

// Create infoWindow
var infoWindow = new google.maps.InfoWindow({
    content: 'Content goes here..'
});

// Create marker
var marker = new google.maps.Marker({
    lat: lat,
    lng: lng,
    title: 'Lima',
    map: map.map,
    infoWindow: infoWindow
});

// This opens the infoWindow
infoWindow.open(map, marker);

You can read about infoWindow at the Google Maps website https://developers.google.com/maps/documentation/javascript/overlays#InfoWindows

Solution 2

Every marker added to the Gmaps.map intance has it's own InfoWindow stored into the markers object. We need the Array index key to that specific marker. Adress by the index key the right InfoWinow o be opened. You can open the GMaps.js specific marker by doing following:

(map.markers[index].infoWindow).open(map.map,map.markers[index]);

Replace [index] by the index of the marker you want the InfoWindow to open.

Solution 3

use the events from google.maps.Marker ('Events' section)

example:

map.addMarker({
    lat: 50.17222520000001,
    lng: 12.196652600000002,
    infoWindow: {
        content: '<p>Foobar</p>'
    },
    mouseover: function(){
        (this.infoWindow).open(this.map, this);
    },
    mouseout: function(){
        this.infoWindow.close();
    }
});

Comments

[daiguachen]

I try it and not have marker on map. now, the code can run, but I want to show infoWindow when program running, not show infoWindow after you click the marker