让谷歌地图加载*后*找到用户的位置
Making the Google Map load *after* finding user's location?
我正在解析XML以直接从数据库中获取多个标记,因此为此使用了Google示例。我现在需要在地图上显示用户的位置(作为中心点)。我发现要么创建一个函数来在地理位置后加载地图很棘手,这就是我出错的地方。
如您所见,我可以提醒经度和经度,但是由于地图首先加载,它不会将地图居中放在这些坐标上。之后我尝试创建一个函数来运行地图,但我一定错过了一些东西。如果有人可以帮助我,那就太好了 - 甚至将加载功能移动到哪里。
我正在使用的测试页面位于此处:http://www.musecosystems.com/app/event_map2.html
if (navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(
function (position) {
var current_latitude = position.coords.latitude;
var current_longitude = position.coords.longitude;
alert ("Latitude"+current_latitude+"Longitude"+current_longitude);mapServiceProvider(position.coords.latitude,position.coords.longitude);
}
);
}
</script><script>
function load() {
var map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(54.046575, -2.8007399),
zoom: 16,
mapTypeId: 'roadmap'
});
var infoWindow = new google.maps.InfoWindow;
document.getElementById("map").style.width=screen.width+"px";
document.getElementById("map").style.height=screen.height+"px";
document.getElementById("map").style.padding="0px";
document.getElementById("map").style.margin="0px";
// Change this depending on the name of your PHP file
downloadUrl("http://www.musecosystems.com/app/server/venue_output.php", function(data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var name = markers[i].getAttribute("name");
var event_name = markers[i].getAttribute("event_name");
var event_start = markers[i].getAttribute("event_start");
var event_link = markers[i].getAttribute("event_link");
var type = markers[i].getAttribute("location_status");
var point = new google.maps.LatLng(
parseFloat(markers[i].getAttribute("latitude")),
parseFloat(markers[i].getAttribute("longitude")));
var html = "<b>" + name + "</b>" + "<br/>" +("<a href='" + event_link + "'>" + event_name + "</a>");;
var icon = customIcons[type] || {};
var marker = new google.maps.Marker({
map: map,
position: point,
icon: icon.icon,
shadow: icon.shadow
});
bindInfoWindow(marker, map, infoWindow, html);
}
});
}
function bindInfoWindow(marker, map, infoWindow, html) {
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(map, marker);
});
}
function downloadUrl(url, callback) {
var request = window.ActiveXObject ?
new ActiveXObject('Microsoft.XMLHTTP') :
new XMLHttpRequest;
request.onreadystatechange = function() {
if (request.readyState == 4) {
request.onreadystatechange = doNothing;
callback(request, request.status);
}
};
request.open('GET', url, true);
request.send(null);
}
function doNothing() {}
</script>
</head>
<body onload="load()">
<div id="map" ></div>
我会尝试以下方法:
。
<script>
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function (position) {
var current_latitude = position.coords.latitude;
var current_longitude = position.coords.longitude;
load(current_latitude, current_longitude);
});
} else {
load(54.046575, -2.8007399);
}
</script>
。
function load(center_lat,center_lng) {
var map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(center_lat, center_lng),
zoom: 16,
mapTypeId: 'roadmap'
});
。
<body><div id="map"></div></body>
顺便说一下:有一个很好的Firefox扩展称为Geolocer,可以测试地理位置是否按预期工作。
相关文章:
- 获取用户位置并将坐标保存在数据库中
- Phonegap通过WiFi和移动网络而非GPS获取用户位置
- 谷歌地图:使用自定义标记显示当前用户位置
- 如何在地图上显示用户位置以及我的标记
- 如何使用“地图”在谷歌地图上显示用户位置;onclick”;作用
- 将 JavaScript 与 GWT 结合使用来获取用户位置,但变量不会被传递
- 在表单中提交用户位置
- 如何在脸书 API 中获取用户位置和用户家乡
- 如何使用jQuery或JavaScript从用户位置返回3个最近的位置
- 现在允许 GPS 时获取用户位置
- 如何使用谷歌地图跟踪用户位置和路线
- 如何使用 IP 地址 + 地理位置获取用户位置 Asp.Net.
- 使用Facebook Javascript SDK访问用户位置数据
- 转换特定日期&基于用户位置的时间到utc日期&时间
- 返回离用户位置(地理位置)最近的3个位置,并列出这些位置
- 地理定位api没有给出准确的用户位置
- JS-Can'找不到用户位置
- 为locationpicker.jquery.js设置当前用户位置
- 获取用户位置时,应用程序是科多瓦android应用程序的背景
- Jquery谷歌地图用户位置