[英]Add Marker - Google Maps API v3
我使用以下Javascript修改了標准Google Maps API的initialize()函數和標准的addMarker函數。 地圖可以很好地加載和居中,但不會將標記添加到地圖中。 我看了前面的問題 ,但不確定自己在做什么錯。
<script type="text/javascript">
// Note that using Google Gears requires loading the Javascript
// at http://code.google.com/apis/gears/gears_init.js
var siberia = new google.maps.LatLng(60, 105);
var newyork = new google.maps.LatLng(40.69847032728747, -73.9514422416687);
var usa = new google.maps.LatLng(44.58, -95.46); //middle of the US w 50 states
var browserSupportFlag = new Boolean();
function initialize() {
var myOptions = {
zoom: 4,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions)
map.setCenter(usa);
}
function getMyLocation() {
var initialLocation= newyork;
var myOptions = {
zoom: 10,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
// Try W3C Geolocation (Preferred)
if(navigator.geolocation) {
browserSupportFlag = true;
navigator.geolocation.getCurrentPosition(function(position) {
initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
map.setCenter(initialLocation);
addMarker(initialLocation);
}, function() {
handleNoGeolocation(browserSupportFlag);
});
// Try Google Gears Geolocation
} else if (google.gears) {
browserSupportFlag = true;
var geo = google.gears.factory.create('beta.geolocation');
geo.getCurrentPosition(function(position) {
initialLocation = new google.maps.LatLng(position.latitude,position.longitude);
map.setCenter(initialLocation);
addMarker(initialLocation);
}, function() {
handleNoGeoLocation(browserSupportFlag);
});
// Browser doesn't support Geolocation
} else {
browserSupportFlag = false;
handleNoGeolocation(browserSupportFlag);
}
function handleNoGeolocation(errorFlag) {
if (errorFlag == true) {
alert("Geolocation service failed.");
initialLocation = newyork;
} else {
alert("Your browser doesn't support geolocation. We've placed you in Siberia.");
initialLocation = siberia;
}
map.setCenter(usa);
}
}
function addMarker(location) {
marker = new google.maps.Marker({
position: location,
map: map,
title: "Hello World!"
});
//markersArray.push(marker);
}
</script>
因此,您的問題與范圍有關:
將此添加到您的初始化函數上方:
var map;
並在您的初始化函數中更改此:
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions)
對此:
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions)
您無需在getlocation函數中重新創建地圖:
因此刪除這些行:
var myOptions = {
zoom: 10,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
這是一個包含更改的jsfiddle:
編輯:我剛剛注意到,當您確定其位置時,您要將縮放級別設置為10。
為此,您可以使用: map.setZoom(10);
而不是通過新的選項。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.