我即将开始在拥有旧版 Google map 的网站中实现 Google map V3。
这是一个很难升级的改变吗?
我还需要将 api key 添加到调用中
例如:
新的通话
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">
上一次通话
<script src="http://maps.google.com/maps?file=api&v=2&key=someKEY">
最后,我需要将鼠标悬停在带有地址的链接上,并且该地址显示在 map 中,这是一项复杂的任务吗?
最佳答案
v3 API 的命名空间、类名和架构与 v2 API 完全不同。我不会说升级很困难,但它并不是微不足道的。进一步阅读:Announcing Google Maps API v3 .
您不再需要 v3 API 的 API key 。只需包含您在问题中提到的脚本即可。
对鼠标悬停时的地址进行地理编码并不是很困难。您可能需要查看以下示例来帮助您入门:
示例:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps Geocoding On Hover</title>
<script src="http://maps.google.com/maps/api/js?sensor=false"
type="text/javascript"></script>
</head>
<body>
<div id="map" style="width: 400px; height: 300px;"></div>
<ul>
<li><a href="#" onmouseover="gc(this);">Oxford Street, London, UK</a></li>
<li><a href="#" onmouseover="gc(this);">5th Ave, New York, USA</a></li>
<li><a href="#" onmouseover="gc(this);">Via Nazionale, Rome, Italy</a></li>
<li><a href="#" onmouseover="gc(this);">Rue de Rivoli, Paris, France</a></li>
</ul>
<script type="text/javascript">
var address = 'London, UK';
var map = new google.maps.Map(document.getElementById('map'), {
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: new google.maps.LatLng(40.71, -74.00),
zoom: 13
});
var geocoder = new google.maps.Geocoder();
var marker;
function gc(element) {
geocoder.geocode({
'address': element.innerHTML
},
function(results, status) {
if(status == google.maps.GeocoderStatus.OK) {
// Clear the previous marker
if (marker) marker.setMap(null);
// Set the new marker
marker = new google.maps.Marker({
position: results[0].geometry.location,
map: map
});
// Center the map on the geocoded result
map.setCenter(results[0].geometry.location);
}
});
}
</script>
</body>
</html>
屏幕截图:
关于javascript - Google API V3 鼠标悬停并调用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3237984/