Javascript 谷歌地图上有多个标记?

Javascript 谷歌地图上有多个标记?,javascript,google-maps,google-maps-api-3,Javascript,Google Maps,Google Maps Api 3,我试图在谷歌地图上实现多个标记,以标记河流的接入点。到目前为止,我有一个显示的标记(myLatlng)和一个单击按钮后显示的anotehr,但是当我尝试添加多个标记(accessPoint1)时,它不会出现。有人知道如何解决这个问题吗?提前谢谢 函数初始化(){ var mylatng=new google.maps.LatLng(51.843143,-2.643555), map=new google.maps.map(document.getElementById('map'),{ 缩放:

我试图在谷歌地图上实现多个标记,以标记河流的接入点。到目前为止,我有一个显示的标记(myLatlng)和一个单击按钮后显示的anotehr,但是当我尝试添加多个标记(accessPoint1)时,它不会出现。有人知道如何解决这个问题吗?提前谢谢

函数初始化(){
var mylatng=new google.maps.LatLng(51.843143,-2.643555),
map=new google.maps.map(document.getElementById('map'),{
缩放:12,
中心:myLatlng}),
marker=新的google.maps.marker({
职位:myLatlng,
地图:地图,
标题:“我们在这里!”
});
var accessPoint1=new google.maps.LatLng(51.840913,-2.638603),
map=new google.maps.map(document.getElementById('map'),{
缩放:12,
中心:accessPoint1}),
marker=新的google.maps.marker({
位置:accessPoint1,
地图:地图,
标题:“接入点1”
});
控件[google.maps.ControlPosition.TOP_CENTER].push($(“#findButton”)[0]);
函数成功回调(位置){
var latlng=new google.maps.latlng(position.coords.latitude,
位置坐标经度),
myOptions={
缩放:3,
中心:拉特林,
mapTypeControl:false,
navigationControlOptions:{style:google.maps.NavigationControlStyle.SMALL},
mapTypeId:google.maps.mapTypeId.ROADMAP
},
边界=新的google.maps.LatLngBounds(latlng);
extend(marker.getPosition());
map.setOptions(myOptions);
映射边界(bounds);
新的google.maps.Marker({
位置:latlng,
地图:地图,
标题:“你在这里!”,
图标:'http://maps.gstatic.com/mapfiles/markers2/boost-marker-mapview.png'
});
}
函数errorCallback(){
警报(“恐怕您的浏览器不支持地理定位。”);
}
函数findMe(){
$(this.hide();
if(导航器.地理位置){
地理定位
.getCurrentPosition(successCallback,errorCallback,{timeout:10000});
}
否则{
警报(“恐怕您的浏览器不支持地理定位。”);
}
}
$(“#findButton”)。单击(FindDME);
}

google.maps.event.addDomListener(窗口,'load',initialize)您正在为第二个接入点重新创建映射,这意味着您有两个映射,每个映射上都有一个标记,其中第一个被覆盖且不可见。您还将覆盖标记变量(这不会导致问题):

除非有多个
,其中包含地图,否则只能创建一个地图

函数初始化(){
var mylatng=new google.maps.LatLng(51.843143,-2.643555),
map=new google.maps.map(document.getElementById('map'){
缩放:12,
中心:myLatlng
}),
marker=新的google.maps.marker({
职位:myLatlng,
地图:地图,
标题:“我们在这里!”
});
var accessPoint1=new google.maps.LatLng(51.840913,-2.638603),
marker1=新的google.maps.Marker({
位置:accessPoint1,
地图:地图,
标题:“接入点1”
});
控件[google.maps.ControlPosition.TOP_CENTER].push($(“#findButton”)[0]);
函数成功回调(位置){
var latlng=new google.maps.latlng(position.coords.latitude,
位置坐标经度),
myOptions={
缩放:3,
中心:拉特林,
mapTypeControl:false,
导航控制选项:{
样式:google.maps.NavigationControlStyle.SMALL
},
mapTypeId:google.maps.mapTypeId.ROADMAP
},
边界=新的google.maps.LatLngBounds(latlng);
extend(marker.getPosition());
map.setOptions(myOptions);
映射边界(bounds);
新的google.maps.Marker({
位置:latlng,
地图:地图,
标题:“你在这里!”,
图标:'http://maps.gstatic.com/mapfiles/markers2/boost-marker-mapview.png'
});
}
函数errorCallback(){
警报(“恐怕您的浏览器不支持地理定位。”);
}
函数findMe(){
$(this.hide();
if(导航器.地理位置){
navigator.geolocation.getCurrentPosition(successCallback、errorCallback、{
超时:10000
});
}否则{
警报(“恐怕您的浏览器不支持地理定位。”);
}
}
$(“#findButton”)。单击(FindDME);
}
google.maps.event.addDomListener(窗口“加载”,初始化)
html,body,#map{
高度:500px;
宽度:500px;
边际:0px;
填充:0px
}

非常感谢您的帮助。:)