2017-02-15 7 views
-1

Привет, у меня есть Google Map, который автоматически проверяет местоположение пользователя и помещает его в центр. У меня проблема с помещением маркера в центр. В настоящее время я добавляю маркер, когда вы нажимаете где-то.Установить Google map marker

Я также хочу очистить существующие маркеры, когда нажата другая позиция.

var markers = []; 
 
window.onload = function() { 
 

 
    if (navigator.geolocation) { 
 
    navigator.geolocation.getCurrentPosition(function(position) { 
 

 
     var pos = { 
 
     lat: position.coords.latitude, 
 
     lng: position.coords.longitude 
 
     }; 
 

 
     infoWindow.setPosition(pos); 
 
     infoWindow.setContent('Location found.'); 
 
     map.setCenter(pos); 
 

 
    }, function() { 
 
     handleLocationError(true, infoWindow, map.getCenter()); 
 
    }); 
 
    } 
 

 
    var mapOptions = { 
 

 
    center: new google.maps.LatLng(21.3891, 39.8579), 
 

 
    zoom: 15, 
 

 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
 

 
    disableDefaultUI: true, 
 

 
    }; 
 

 
    var infoWindow = new google.maps.InfoWindow(); 
 

 
    var latlngbounds = new google.maps.LatLngBounds(); 
 

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

 

 
    // This event listener calls addMarker() when the map is 
 
    // clicked. 
 

 
    map.addListener('click', function(e) { 
 
    placeMarker(e.latLng, map); 
 

 
    }); 
 

 
    function placeMarker(position, map) { 
 

 
    var marker = new google.maps.Marker({ 
 
     position: position, 
 
     map: map 
 
    }); 
 
    map.panTo(position); 
 
    } 
 

 

 
    google.maps.event.addListener(map, 'click', function(e) { 
 

 
    document.getElementById("lat").value = (e.latLng.lat()); 
 

 
    document.getElementById("lng").value = (e.latLng.lng()); 
 

 
    div = document.getElementById('name'); 
 
    div.style.display = "block"; 
 

 
    div = document.getElementById('submit'); 
 
    div.style.display = "block"; 
 

 
    var element = document.getElementById('spacing'); 
 

 
    element.style.margin = null; 
 

 
    }); 
 
}
#map { 
 
    height: 100%; 
 
    margin: 0px; 
 
}
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA-2vW1cIR0t0ZVfVdCmcxx0QEV4C3l6hk&callback=myMap"></script> 
 

 
<div id="map" style="width:100%; height:505px ; z-index: 1;"> 
 

 

 
</div>

ответ

0

Привет добавил этот код в существующий код, чтобы добавить маркер к центру:

infoWindow.setPosition(pos); 
infoWindow.setContent('Location found.'); 
map.setCenter(pos); 

вар маркер = новый google.maps.Marker ({позиция: пос , анимация: google.maps.Animation.BOUNCE, значок: 'img/mapicon.png'});

marker.setMap (Карта);

}, 
function() { 
handleLocationError(true, infoWindow, map.getCenter()); 
}); 
} 
0

Для решения secoind, я добавил:

       function placeMarker(position, map) { 

          var marker = new google.maps.Marker({ 
           position: position, 
           icon: 'img/mapicon.png', 
           map: map 
          }); 
          map.panTo(position); 
          markers.push(marker); 

          } 

          function setMapOnAll(map) { 
          for (var i = 0; i < markers.length; i++) { 
           markers[i].setMap(map); 
          } 
          } 


          function clearMarker(position, map) { 

          setMapOnAll(null); 
          } 

 Смежные вопросы

  • Нет связанных вопросов^_^