CODEWITHSUNDEEP
javascriptgoogle-mapsgoogle-maps-api-3
John Lim
John Lim

Reputation: 3109

dragend,dragstart and "Uncaught TypeError: Cannot read property '_e3" error

what i'm trying to create is a "Click" Event for user to place a marker on the map , beside that if user wanted to change the marker position user can drag the marker to where they want. but the dragstart and dragend don't the trick and i can't figure it out why ...

and "Uncaught TypeError: Cannot read property '_e3' of undefined" error is in my error log , i have tried several way to solve it but still can't managed to .... so guys any idea how to solve it ? Your help is appreciated thank you 

 <script type="text/javascript">
var map;
var geocoder;
var marker;
var mapOptions
function initialize() {
     mapOptions = {
      center: new google.maps.LatLng(3.1597,101.7000),
      zoom: 12,
      disableDefaultUI: true,
      mapTypeId: google.maps.MapTypeId.ROADMAP,
       mapTypeControl: true,
    mapTypeControlOptions: {
    style: google.maps.MapTypeControlStyle.DROPDOWN_MENU,
    position: google.maps.ControlPosition.TOP_LEFT
          },
    };
     map = new google.maps.Map(document.getElementById("map-canvas"),
        mapOptions);
     geocoder = new google.maps.Geocoder();

      google.maps.event.addListenerOnce(map, 'click', function(event) {
            placeMarker(event.latLng);
          });
      function placeMarker(location) {
            marker = new google.maps.Marker({
            position: location,
            map: map,
            draggable:true
          });
        }
          google.maps.event.addListener(marker, 'dragstart', function(evt){
            document.getElementById('current').innerHTML = '<p>Currently dragging marker...</p>';
        });
        google.maps.event.addListener(marker, 'dragend', function(evt){
          document.getElementById('current').innerHTML = '<p>Marker dropped: Current Lat: ' + evt.latLng.lat().toFixed(3) + ' Current Lng: ' + evt.latLng.lng().toFixed(3) + '</p>';
      });



}
google.maps.event.addDomListener(window, "load", initialize);


</script>

in order to confirm the dragend and dragstart event is working i added an ID in my html to show the latest lat and lng

  <div id="current">Nothing yet...</div>

Upvotes: 1

Views: 2775

Answers (1)

Dr.Molle
Dr.Molle

Reputation: 117314

You should move the two calls of addListener into placeMarker, otherwise marker is undefined when they are executed.

Upvotes: 1

Related Questions