jQuery Google Maps Adding a Marker on Click

Question

i am using gmaps.js (https://github.com/hpneo/gmaps)

I want to add a Marker on the map on clicking a location on the map. If a user clicks on a second location the previous marker should move to the new place or be removed and replaced with a new marker.

Now sure if this is supported by the Lib.

http://bakasura.in/startupsradar/add.html

$(document).ready(function () {
    var map = new GMaps({
        div: '#map',
        lat: 13.00487,
        lng: 77.576729,
        zoom: 13
    });

    map.addMarker({
        lat: 13.00487,
        lng: 77.576729,
        title: 'Mink7',
        infoWindow: {
            content: 'HTML Content'
        }
    });
    /*
    GMaps.geolocate({
        success: function (position) {
            map.setCenter(position.coords.latitude, position.coords.longitude);
        },
        error: function (error) {
            alert('Geolocation failed: ' + error.message);
        },
        not_supported: function () {
            alert("Your browser does not support geolocation");
        },
        always: function () {
            //alert("Done!");
        }
    });
    */
});

Sorin Trimbitas · Accepted Answer · 2014-09-12 11:59:56Z

3

google.maps.event.addListener(_map, "click", function(event) {
    if(_marker) {
        _marker.setPosition(event.latLng);
    } else {  
        _marker = new google.maps.Marker({
            position: event.latLng,
            map: _map,
            title: "myTitle"
        });
    }
});

Just saw the other answer, use this if you dont want to create a marker everytime.. _marker should be a global variable.

edited Sep 12, 2014 at 11:59

Sorin Trimbitas

1,49720 silver badges38 bronze badges

answered Jun 23, 2012 at 9:08

Baz1nga

15.6k3 gold badges38 silver badges63 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Nadir Sampaoli · Accepted Answer · 2012-06-23 08:55:47Z

2

Personally, I do it using a global variable for the marker (or an array if I need more markers and I want to access them later), so that I can delete it and recreate it somewhere else.

// instantiate your var map
// ...

google.maps.event.addListener(map, "click", function(event) {
    if(markermap) {
        markermap.setMap(null);
    }

    markermap = new google.maps.Marker({
        position: event.latLng,
        map: myMap,
        title: "myTitle"
    });
});

answered Jun 23, 2012 at 8:55

Nadir Sampaoli

5,5654 gold badges24 silver badges34 bronze badges

Collectives™ on Stack Overflow

jQuery Google Maps Adding a Marker on Click

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related