Маркер Перетащить Событие Google Maps

Question

У меня есть карты google и маркер, который определяет мою позицию, это перетаскиваемый маркер с инфоиндустом.

Вот мой код

var marker; 
var infowindowPhoto; 
var latPosition; 
var longPosition; 
var newLocationLat; 
var newLocationLong; 

function initializeMarker() 
{ 

    if(navigator.geolocation) 
    { 
    navigator.geolocation.getCurrentPosition(function(position) 
    { 
     var pos = new google.maps.LatLng(position.coords.latitude,position.coords.longitude); 

     latPosition = position.coords.latitude; 
     longPosition = position.coords.longitude; 

     //alert("Latitude:"+latPosition); 
     //alert("Longitude:"+longPosition); 

     marker = new google.maps.Marker 
     ({ 
      position: pos, 
      draggable:true, 
      animation: google.maps.Animation.DROP, 
      map: map 

     });   
     markersArray.push(marker); 

     google.maps.event.addListener(marker, 'click', function (event) 
     { 
      infowindowPhoto.open(map,marker); 

      document.getElementById("latbox").value = this.getPosition().lat(); 
      document.getElementById("lngbox").value = this.getPosition().lng(); 

      latPosition = this.getPosition().lat(); 
      longPosition = this.getPosition().lng(); 

     }); 


     google.maps.event.addListener(marker,'dragend', function (event) 
     { 
      infowindowPhoto.open(map,marker); 

      document.getElementById("latbox").value = this.getPosition().lat(); 
      document.getElementById("lngbox").value = this.getPosition().lng(); 

      newLocationLat = this.getPosition().lat(); 
      newLocationLong = this.getPosition().lng();        
     }); 

     infowindowPhoto.open(map,marker); 

     map.setCenter(pos); 
    }, 
    function() 
    { 
     handleNoGeolocation(true); 
    }); 
    } 
    else 
    { 

    handleNoGeolocation(false); 
    } 

    contentString ='<h1 id="firstHeading" class="firstHeading">Uluru</h1>'; 

    infowindowPhoto = new google.maps.InfoWindow 
    ({ 
     content: contentString 
    }); 
} 

function Alert() 
{ 

    alert("Latitude:"+latPosition); 
    alert("Longitude:"+longPosition); 

    alert("newLatitude:"+newLocationLat); 
    alert("newLongitude:"+newLocationLong); 

} 

Маркер первый расположен в моем месте, если я не перетащить маркер его показать мне в функции предупредит свою позицию. Таким образом, в двух первых предупреждениях в функции aloert это показывает мне мою позицию, и два других предупреждения не определены.

Теперь моя проблема заключается в том, что я хочу, когда я не двигают маркер, что эта функция будет работать

google.maps.event.addListener(marker, 'click', function (event) 
     { 
      infowindowPhoto.open(map,marker); 

      document.getElementById("latbox").value = this.getPosition().lat(); 
      document.getElementById("lngbox").value = this.getPosition().lng(); 

      latPosition = this.getPosition().lat(); 
      longPosition = this.getPosition().lng(); 

     }); 

Я хочу, когда я перетащить маркер, что эта работа

 google.maps.event.addListener(marker,'dragend', function (event) 
     { 
      infowindowPhoto.open(map,marker); 

      document.getElementById("latbox").value = this.getPosition().lat(); 
      document.getElementById("lngbox").value = this.getPosition().lng(); 

      newLocationLat = this.getPosition().lat(); 
      newLocationLong = this.getPosition().lng();        
     }); 

Так я могу только показать только мою новую должность. Спасибо за помощь.

///////////////////////////////// Обновление //////// /////////////////////////// У меня есть этот код, который показывает мне новую широту и долготу в html-вводе:

<div id="latlong"> 
<p>Latitude: <input size="20" type="text" id="latbox" name="lat" ></p> 
<p>Longitude: <input size="20" type="text" id="lngbox" name="lng" ></p> 

Answer 1

несколько советов:

1. Избегайте ненужного кода, когда у вас возникли проблемы с сценарием. Разделите это на необходимое.
2. Всегда отправляйте необходимый код по вашему вопросу (вы его обновили). Хорошая точка зрения.
3. Избегайте дублирования кода в разных местах. Создайте для этого функции.

Теперь я понимаю, что вы хотите показать местоположение пользователя на 2 входа. Я думал, что вы хотите показать это в инфоиндусте, что я и сделал в приведенном ниже коде (но основная идея такая же).

Несколько замечаний:

1. код внутри обработчика событий (нажмите, dragend и т.д.) выполняется только тогда, когда событие.
2. Вы можете использовать метод infowindow setContent, если хотите обновить его содержимое.

Вот код:

var map; 
var marker; 
var infowindowPhoto = new google.maps.InfoWindow(); 
var latPosition; 
var longPosition; 

function initialize() { 

    var mapOptions = { 
     zoom: 8, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     center: new google.maps.LatLng(10,10) 
    }; 

    map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); 

    initializeMarker(); 
} 

function initializeMarker() { 

    if (navigator.geolocation) { 

     navigator.geolocation.getCurrentPosition(function (position) { 

      var pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); 

      latPosition = position.coords.latitude; 
      longPosition = position.coords.longitude; 

      marker = new google.maps.Marker({ 
       position: pos, 
       draggable: true, 
       animation: google.maps.Animation.DROP, 
       map: map 
      }); 

      map.setCenter(pos); 
      updatePosition(); 

      google.maps.event.addListener(marker, 'click', function (event) { 
       updatePosition(); 
      }); 

      google.maps.event.addListener(marker, 'dragend', function (event) { 
       updatePosition(); 
      }); 
     }); 
    } 
} 

function updatePosition() { 

    latPosition = marker.getPosition().lat(); 
    longPosition = marker.getPosition().lng(); 

    contentString = '<div id="iwContent">Lat: <span id="latbox">' + latPosition + '</span><br />Lng: <span id="lngbox">' + longPosition + '</span></div>'; 

    infowindowPhoto.setContent(contentString); 
    infowindowPhoto.open(map, marker); 
} 

initialize(); 

Вот дем:

JSFiddle demo

Надеется, что это помогает! Если у вас есть вопросы, не стесняйтесь спрашивать!