我正在尝试向用户添加在谷歌地图上标记其商店位置的功能,然后我获取用户的标记坐标并将其存储。我该怎么做。
这是我当前的代码,只显示一个位置:
function initMap() {
var myLatlng = {lat: 35.6961, lng: 51.4231};
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 8,
center: myLatlng
});
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: 'Click to zoom'
});
map.addListener('click', function() {
// 3 seconds after the center of the map has changed, pan back to the
// marker.
window.setTimeout(function() {
map.panTo(marker.getPosition());
}, 3000);
});
marker.addListener('click', function() {
map.setZoom(8);
map.setCenter(marker.getPosition());
});
}
我会对此发表评论,但我不能,这很简单,您已经有了一个用于在 Gmaps 中标记点的工作代码,只需为用户提供保存一些坐标的方法,您甚至可以在单击地图时使用 gmaps 抓取坐标。 但简单的方法是让用户输入自己的数据。 然后将数据存储在数据库中,然后您可以稍微调整一下此代码您的需求:
var mapProp = {
//this is the starting point of the map
center: new google.maps.LatLng(6.847811, -70.483842),
zoom: 8,
mapTypeId: google.maps.MapTypeId.HYBRID
};
map = new google.maps.Map(document.getElementById("googleMap"), mapProp);
for (var mark in json) {
var lat = json[mark].estaciones_latitud;
var long = json[mark].estaciones_longitud;
var marcador = new google.maps.Marker({
position: new google.maps.LatLng(lat, long),
animation: google.maps.Animation.DROP,
title: json[mark].estaciones_nombre
});
marcador.setMap(map);//sets the point in map
google.maps.event.addListener(marcador, 'click',function () {
doSomething(this.internalPosition.A, this.internalPosition.F, this.title);//this listener works when you click the mark
});
}
google.maps.event.addDomListener(window, 'load', initialize);
这是一个工作代码,它抓住了我在这个 JSON 对象上传递的每个点,并在地图上 DRWAS 上传递了这些点。