谷歌地图 - 当前位置
,如果你想获得街道地址!
包括JS和MAP API密钥keep all together from the wizard
我的代码看起来是这样的:(使用也有几分的jQuery)
var geocoder = null;
var lat = null;
var lng = null;
$(function() {
if (GBrowserIsCompatible()) {
if (google.loader.ClientLocation &&
// i used this here cause not always
//this retrieve the correct LAT & LON
// so set it manually
google.loader.ClientLocation.address.country_code == "IT") {
lat = google.loader.ClientLocation.latitude;
lng = google.loader.ClientLocation.longitude;
} else {
//alert('Insert Your Latitude & longitude manually!');
lat = '42.464826';
lng = '14.214095';
}
//creat the full LAT + LON
points = new GLatLng(lat , lng);
//get the Street Address
get_address(points);
}
});
function get_address(latlng) {
if (latlng) {
geocoder = new GClientGeocoder();
geocoder.getLocations(latlng, function(addresses) {
if(addresses.Status.code != 200) {
alert("reverse geocoder failed to find an address for " + latlng.toUrlValue());
}
else {
address = addresses.Placemark[0];
var myHtml = address.address;
$('#address').text(myHtml);
}
});
}
};
peraphs读这个链接可以帮助过:
用户的位置提供google.loader.ClientLocation(这将包含基于客户端IP猜测,如果IP是已知的)
google.loader.ClientLocation
当一个应用程序使用的 AJAX API装载机,装载机试图 进行地理定位基于其 IP地址的客户端。如果这个过程成功, 客户端的位置,作用范围是 地铁水平,在 google.loader.ClientLocation财产提供。 如果过程没有找到匹配, 这个属性被设置为null。
http://code.google.com/apis/ajax/documentation/#ClientLocation
'google.loader.ClientLocation'已过时。 brokers! – 2016-07-02 00:07:51
如果你需要的东西比IP地理定位更精确,你可以使用在支持的浏览器的W3C Geolocation API(值得注意的是,Firefox 3.5及移动Safari)要求用户的经度和纬度,然后用Google's client-side reverse geocoding service来猜测用户的近似街道地址。 (my test page包含这两个步骤的代码示例。)
如果你走这条路线,一定要向用户说明你为什么要求他们的位置以及你如何使用他们的信息(例如,你不保存它,直到他们真正提交表单),因为它在技术上由API因为许多用户将可以多么容易猜出他们的街道地址穆斯特出来需要。
我正在寻找如何映射当前位置和目标位置。在这里实现,这是我做过什么:
注*替换:YOUR_DESTINATION_ADDRESS与地址一样的格式:“147 +温德姆+街道+ N +,+套房+ 206,+圭尔夫大学,+在+ N1H + 4E9"
<div id="Map" style="width: 100%; height: 600px;"> </div>
<script type="text/javascript">
$(function(){
var zoom = 11;
function success(position) {
var LAT = position.coords.latitude;
var LONG = position.coords.longitude;
$('#Map').append('<p>Current Latitude: ' + LAT + '<br/>Current Logitude: ' + LONG +'<br/><br/>Note* This may not display your exact location, but just your city. Works better on mobile devices</p>');
var map = '<iframe style="width: 100%; height: 600px;" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.ca/maps?source=s_d&saddr=' + LAT +',+' + LONG +'&daddr=**YOUR_DESTINATION_ADDRESS**&ie=UTF8&t=hz=' + zoom + '&output=embed"></iframe>';
$('#Map').append(map);
}
function error(){
/*Error Code*/
}
function MakeMap(){
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(success, error);
}
}
MakeMap();
});
</script>
是有可能实现的HTML机身采用HTML 5和谷歌API 3,你必须改变你的APIKey和地图帆布给定的代码是一个元素
<script type="text/javascript"
src="https://maps.googleapis.com/maps/api/js?key=yourAPIKey&sensor=false"></script>
<script type="text/javascript">
var lat;
var lng;
function initialize() {
if (navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(showPosition);
}
}
function showPosition(position)
{
lat = position.coords.latitude;
lng = position.coords.longitude;
var myLatlng = new google.maps.LatLng(lat, lng);
var myTittle = "My Current Location! Lat: " + lat + "lng: " + lng;
var marker = new google.maps.Marker({
position: myLatlng,
title: myTittle
});
var mapOptions = {
center: myLatlng,
zoom: 16,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map-canvas"),
mapOptions);
marker.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
没问题! ;-) – 2010-03-23 08:31:26