1. [代码]通过ip地址查询物理地址显示谷歌地图
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="x-ua-compatible" content="ie=7" />
<meta http-equiv="Content-Type" content='text/html'; charset='UTF-8'; />
<title>通过ip地址查询物理地址显示谷歌地图</title>
<!--调用谷歌地图js，zoom缩放倍数，center中心，mapTypeId地图类型-->
<script type="text/javascript" src="http://ditu.google.com/maps/api/js?sensor=true"></script>
<script language="javascript">
var geocoder;
var map;
function initialize() {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(39.9493, 116.3975);
var myOptions = {
zoom: 15,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var address = document.getElementById("address").value;
var img='http://www.google.com/images/logos/google_logo_41.png';
if (geocoder) {
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location,
title:'位置',
icon:img
});
getInfor(map,marker,address,results[0].geometry.location);
addListener(marker)
}
});
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}
/*弹出信息窗口*/
function getInfor(map,marker,address,ln){
var infowindow = new google.maps.InfoWindow({
content: address+"\n"+ln
});
infowindow.open(map,marker);
}
/*监听事件 经纬值*/
function addListener(marker){
var infowindow = new google.maps.InfoWindow({
content:'点点试试哦！',
pixelOffset:({width:50, height:20})
});
google.maps.event.addListener(marker, 'click', function(event) {
alert("你选择的经度是："+event.latLng.lat()+" 纬度是："+event.latLng.lat());
infowindow.open(map,marker);
});
}
</script>
<body onload="initialize()">
<p style="align:center">通过ip地址查询物理地址显示谷歌地图//m.sbmmt.com/;/p>
<p id="map_canvas" style="width: 580px; height: 580px;align:center"></p>
<p>
<form method="post" action="">
输出ip地址：<input type="text" name="ip" value="117.136.11.2">
<input type="submit" value="提交">
</form>
位置： <input type="text" id="address" size="40" value="中国福建省福州市 移动" >
</p>
</body>
php入门到就业线上直播课：查看学习
声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn核实处理。
前端(VUE)零基础到就业课程：点击学习
快捷开发Web应用及小程序：点击使用
