Google地图API - 客户当前位置的中心地图 [英] Google maps API - Center map on client's current location
本文介绍了Google地图API - 客户当前位置的中心地图的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我已经看过这个问题的其他各个时期，但我不能很好地指出我要出错的地方，这是我的代码：
< HTML>
< head>
< title>地图< /标题>
< style>
html，body，＃map-canvas {
margin：0;
padding：0;
height：500px;
width：800px;}
< / style>
< script src =https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false>< / script>
< script>
var map;
函数initialize（）
{
var myLatlng1 = new google.maps.LatLng（53.65914，0.072050）;
var mapOptions =
{
zoom：10，
center：myLatlng1，
mapTypeId：google.maps.MapTypeId.ROADMAP
} ;
var map = new google.maps.Map（document.getElementById（'map-canvas'），
mapOptions）;
<？php
$ sql = mysql_query（SELECT * FROM data ORDER BY ID DESC）;
while（$ row = mysql_fetch_array（$ sql））
{
$ desc = $ row ['DESCRIPTION'];
$ location = $ row ['LOCATION'];
$ counter + = 1;
？>
var marker = new google.maps.Marker（{
position：new google.maps.LatLng（<？php echo $ location;？>），
map ：map，
title：'<？php echo $ desc;？>'，
icon：'/image/cam.png'
}）;
navigator.geolocation.getCurrentPosition（showPosition）;
}
var showPosition = function（position）
{
map.setCenter（new google.maps.LatLng（position.coords.latitude，position.coords。经度），16）;
}
google.maps.event.addDomListener（window，'load'，initialize）;
< / script>
< / head>
它最初将中心设置为myLatlng1，底部的代码将其设置为用户的当前位置不做任何事情，任何想法？
预先感谢。
使用下面的代码获取用户的当前位置（ GEOLOCATION ）：
if（navigator.geolocation）{
navigator.geolocation.getCurrentPosition（function（position）{
initialLocation = new google.maps.LatLng（position.coords.latitude，position.coords.longitude）;
map.setCenter（initialLocation）;
}）;
}
为了演示一个例子，我已经删除了你的php代码。检查此 JSFiddle
希望你明白。
I've looked at the various other times this question has been asked but I can't quite put a finger on where I'm going wrong, here's my code:
<html>
<head>
<title> Map </title>
<style>
html, body, #map-canvas {
margin: 0;
padding: 0;
height: 500px;
width: 800px;}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>
var map;
function initialize()
{
var myLatlng1 = new google.maps.LatLng(53.65914, 0.072050);
var mapOptions =
{
zoom: 10,
center: myLatlng1,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
<?php
$sql = mysql_query("SELECT * FROM data ORDER BY ID DESC");
while($row =mysql_fetch_array($sql))
{
$desc = $row['DESCRIPTION'];
$location = $row['LOCATION'];
$counter += 1;
?>
var marker = new google.maps.Marker({
position: new google.maps.LatLng(<?php echo $location; ?>),
map: map,
title: '<?php echo $desc; ?>',
icon: '/image/cam.png'
});
navigator.geolocation.getCurrentPosition(showPosition);
}
var showPosition = function (position)
{
map.setCenter(new google.maps.LatLng(position.coords.latitude, position.coords.longitude), 16);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
It originally sets the center to myLatlng1, and the code at the bottom to set it to the user's current location doesn't do anything, any ideas?
Thanks in advance.
解决方案
Try using the below code to get the user's current location (GEOLOCATION):
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function (position) {
initialLocation = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
map.setCenter(initialLocation);
});
}
For showing an example, I've removed your php code. Check this JSFiddle
Hope you understand.
这篇关于Google地图API - 客户当前位置的中心地图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
