CODEWITHSUNDEEP
javascriptjqueryhtmlgoogle-mapsgoogle-maps-api-3
daiguachen
daiguachen

Reputation: 121

How auto open infoWindow in gmaps v0.3

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.

Upvotes: 9

Views: 19430

Answers (3)

JuKe
JuKe

Reputation: 673

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();
    }
});

Upvotes: 4

daan.desmedt
daan.desmedt

Reputation: 3820

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.

Upvotes: 6

Tommy Bjerregaard
Tommy Bjerregaard

Reputation: 1099

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

Upvotes: 16

Related Questions