基于ip的手机地理定位
现在lbs服务比较火,基本上都需要定位用户的地理信息,用户地理信息一般是通过gps来定位实现的,那么假如
用户的gps坏了,或者没有开启,那么怎么获得用户的地理信息的呢?替代的办法就是可以获得手机真实ip信息来大致获取手机用户的
大概位置,虽然不是很精确,但是在精确度不高的情况下可以临时代替一下,本文就是实现如何通过ip来定位用户的。这里主要使用获得pc端模拟手机端原理
使用工具:
地图:谷歌地图Google Maps JavaScript API V3
首先介绍一下谷歌地图定位地理信息的原理:根据经纬度查询出用户的地理信息,====gps可以获得经纬度。
也可以使用谷歌的共享地理位置信息 ,例如火狐的有http://www.mozilla.com/zh-CN/firefox/geolocation/可以体验一下共享地理信息,不过那个技术是基于w3c标准的,目前ie还不是支持。
本文要实现的:根据ip 查询获得ip的地理信息 和在地图中的显示
设计思想: 获得ip信息--->查询到ip地理位置(如杭州 北京等,这个有两种方法一种是使用ip数据库,另外一种是门户网站接口,我的另外一篇有详细介绍http://blog.csdn.net/youacai/article/details/6584969)
----->根据获得的地理信息,谷歌把他转化为经纬度---->经纬度定位
本次修改增加了弹出信息窗口和 事件监听方法(监听经纬值)还是 在地图中显示图像功能
1:获得用户ip信息
这里推荐使用腾讯的ip开放接口,地理信息比较全,获得ip信息的更详细介绍http://blog.csdn.net/youacai/article/details/6584969
这个带有查询ip功能的方法,手机获得手机端ip信息传到这个方法,获取到地理位置
//根据腾讯接口查询ip地址
function getIPLoc($queryIP){$url = 'http://ip.qq.com/cgi-bin/searchip?searchip1='.$queryIP;$ch = curl_init($url);curl_setopt($ch,CURLOPT_ENCODING ,'gb2312');curl_setopt($ch, CURLOPT_TIMEOUT, 10);curl_setopt($ch, CURLOPT_RETURNTRANSFER, true) ; // 获取数据返回$result = curl_exec($ch);$result = mb_convert_encoding($result, "utf-8", "gb2312"); // 编码转换,否则乱码curl_close($ch);preg_match("@<span>(.*)</span></p>@iU",$result,$ipArray);
$loc = $ipArray[1];
return $loc;
}
//方法2 直接获得客户端ip地址
function getIpPlace(){$ip=file_get_contents("http://fw.qq.com/ipaddress");$ip=str_replace('"',' ',$ip);$ip2=explode("(",$ip);$a=substr($ip2[1],0,-2);$b=explode(",",$a);return $b;
}
<script type="text/javascript" src="http://ditu.google.com/maps/api/js?sensor=true"></script>
设置谷歌地图的参数
zoom是地图显示的缩放级数,center是地图的中心位置,maptypeid是地图的类型,address主要获取查询到的地理信息,
gecode主要是谷歌地图吧地理信息转化为经度纬度值,title主要是点击时候的名称,icon主要是锚点的背景图像,没有的话就是是默认值
<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://avatar.csdn.net/B/9/A/1_youacai.jpg';
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});
} }); } map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); }
弹出信息窗口
content是提示信息,它支持自定义的DOM样式,监听事件了有演示
open是打开窗口,相应的close是关闭窗口
/*弹出信息窗口*/function getInfor(map,marker,address,ln){var infowindow = new google.maps.InfoWindow({content: address+"\n"+ln });
infowindow.open(map,marker);
}
监听事件
主要是监听鼠标对地图的操作,跟js很相似
本文演示的是点击的事件,
pixeloffset是指窗口相对应焦点的位置偏移量
google.maps.event.addListener(marker, 'click', function(event)监听点击事件,焦点是marker也就是背景图像的地方,
alert弹出对应焦点的经纬信息
备注:csdn编辑器会自动生成很多<span style="white-space: pre; ">,复制的时候建议删除这些
/*监听事件 经纬值*/function addListener(marker){
var infowindow = new google.maps.InfoWindow({content:'<div style="color:#F00"><a href="http://blog.csdn.net/youacai">php淮北<img src="http://avatar.csdn.net/B/9/A/1_youacai.jpg" width="30" height="30" alt="tt"></a> 点点试试哦</div>',
pixelOffset:({width:50, height:120}) });
google.maps.event.addListener(marker, 'click', function(event) {alert("你选择的经度是:"+event.latLng.lat()+" 纬度是:"+event.latLng.lat());
infowindow.open(map,marker);});
}
放置谷歌地图的容器
<div id="map_canvas" style="width: 320px; height: 480px;"></div>
3:附带一个查询天气的接口
/*获得天气预报信息*/<br/><iframe src="http://weather.265.com/weather.htm" width="168" height="54" frameborder="no" border="0" marginwidth="0&quoat; marginheight="0" scrolling="no"></iframe>
下面是源码程序:[备注有人反映程序不能运行 ,经查csdn的编辑器自动在我代码判断非空的时候!empty又增加了一个empty,还会自动那个增加一些空白代码(不知道怎么回事),同学复制的时候注意把他去掉即可,另外本程序编码默认是utf8,浏览器也是utf8 哦]
<?php
//根据腾讯接口查询ip地址
function getIPLoc($queryIP){$url = 'http://ip.qq.com/cgi-bin/searchip?searchip1='.$queryIP;$ch = curl_init($url);curl_setopt($ch,CURLOPT_ENCODING ,'gb2312');curl_setopt($ch, CURLOPT_TIMEOUT, 10);curl_setopt($ch, CURLOPT_RETURNTRANSFER, true) ; // 获取数据返回$result = curl_exec($ch);$result = mb_convert_encoding($result, "utf-8", "gb2312"); // 编码转换,否则乱码curl_close($ch);preg_match("@<span>(.*)</span></p>@iU",$result,$ipArray);
$loc = $ipArray[1];
return $loc;
}//方法2 直接获得客户端ip地址
function getIpPlace(){$ip=file_get_contents("http://fw.qq.com/ipaddress");$ip=str_replace('"',' ',$ip);$ip2=explode("(",$ip);$a=substr($ip2[1],0,-2);$b=explode(",",$a);return $b;
}
$ip=getIpPlace();
$address =!empty($ip['3'])? iconv('gbk','utf-8',$ip['3']):'';//获得提交的ip信息
if($_POST){$ip = trim($_POST['ip']);$loc = trim(getIPLoc($ip));$locip = trim($_POST['ip']);
}else{$ip=getIpPlace();$loc =!empty($ip['3'])? iconv('gbk','utf-8',$ip['3']):'';$locip = iconv('gbk','utf-8',$ip['0']);
}?>
<!--调用谷歌地图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://avatar.csdn.net/B/9/A/1_youacai.jpg';
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:'<div style="color:#F00"><a href="http://blog.csdn.net/youacai">php淮北<img src="http://avatar.csdn.net/B/9/A/1_youacai.jpg" width="30" height="30" alt="tt"></a> 点点试试哦</div>',
pixelOffset:({width:50, height:120}) });
google.maps.event.addListener(marker, 'click', function(event) {alert("你选择的经度是:"+event.latLng.lat()+" 纬度是:"+event.latLng.lat());
infowindow.open(map,marker);});
}</script>
<body οnlοad="initialize()"><div id="map_canvas" style="width: 320px; height: 480px;"></div><div><form method="post" action="">
输出ip地址:<input type="text" name="ip" value=<?php echo $locip;?>>
<input type="submit" value="提交"></form>位置: <input type="text" id="address" size="40" value=<?php echo $loc;?> ></div>
/*获得天气预报信息*/<br/><iframe src="http://weather.265.com/weather.htm" width="168" height="54" frameborder="no" border="0" marginwidth="0&quoat; marginheight="0" scrolling="no"></iframe>
</body>
上面是查询前后的截图
基于ip的手机地理定位相关推荐
- chrome浏览器模拟手机 地理定位
chrome浏览器模拟手机 地理定位 在pc端做touch页面调试的时候,常常会遇到需要模拟定位的情况 chrome浏览器有着强大的调试工具,尤其是新版chrome浏览器 下面我就以新版chrome浏 ...
- html定位的实例,H5案例分享:基于浏览器的HTML5地理定位
基于浏览器的HTML5地理定位 地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML ...
- html5经纬度定位 源码_基于浏览器的HTML5地理定位
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理和一个 ...
- Sitecore开发 IP地理定位服务入门
如果您是营销人员或开发人员,并且有兴趣在Sitecore安装中使用Sitecore IP Geolocation服务,那么本文就是为您准备的. 借助Sitecore IP地理定位服务,您网站的访问者可 ...
- ip地址怎么精确定位 手机如何改ip地址位置
ip地址精确定位 方法一 IP地址查询服务:使用在线的IP地址查询服务,如ip138.com.ip2location.com等,输入要查询的IP地址,系统将返回精确到地理位置的相关信息,包括国家.地区 ...
- 手机室内地磁定位软件_一种基于地磁的智能手机实时定位方法与流程
本发明涉及室内地磁定位导航方法,具体涉及一种基于地磁的智能手机实时定位方法,属于移动计算和室内定位技术领域. 背景技术: 随着室内定位导航的日益需求,利用地磁信息作为位置指纹的室内定位导航技术显示出其 ...
- HTML5 新特性 - 地理定位(基于高德地图API)
定位的基础与原理 IP定位 运营商基站定位 GPS定位 地理定位的实现 地理定位API允许用户向web应用程序提供他们的位置(经纬度).但是这个操作需要用户授权. 获取地理定位的相关代码如下: let ...
- 基于IP地址的高精准IP定位产品—— IP问问
随着互联网日新月异的发展,IP地址定位及IP地址库市场已发展十余年之久.长久以来市场中的产品数据陈旧.定位颗粒度粗糙,仅能达到城市级别.即使近年来市场中出现了相比城市级别精度有所提升的IP定位产品,但 ...
- html5 解决手机休眠暂停gps,手机在Android上唤醒后,HTML5地理定位失败,导致GPS失败...
在Android的默认浏览器,一切工作正常,但我有一个奇怪的错误,这似乎只发生在Android设备上. 在第一页上加载浏览器问我,如果我接受分享我的位置和地理定位功能按预期工作. 但是,如果我让手机入 ...
最新文章
- 【剑指offer-Java版】22栈的压入弹出序列
- vue第二次ajax失效,解决VUE-Router 同一页面第二次进入不刷新的问题
- python plt_python的plt
- 计算机系统结构——概述
- 迈出从3K到1W的重要一步——掌握设计模式
- Could not clean server of obsolete files
- 计算机学习路线推荐(初稿)
- 日志时间与系统时间不一致问题解决方法
- 在你学习计算机的路上,哪些书籍对你的帮助最大?
- b2b2c商城php源码,多用户B2B2C商城系统 thinkphp5.0
- 视频教程-微信公众号实战(Java版本,带前后台)-微信开发
- ABP实战--集成Ladp/AD认证
- 什么是群、什么是阿贝尔群(abel群、阿贝尔群也称为交换群或可交换群)、群论入门
- 软件开发的功能性需求和非功能性需求
- 「唇语识别技术」看不透TA的心,但可以听懂TA的话
- 使用CAS框架快速实现单点登录
- Postgresql学习笔记-高级语法篇
- c#实现打印快递单-提供源码
- 安道麦完成名称统一,挂牌深交所交易
- 系统无损迁移、硬盘系统复制完整教程(常用于升级更大硬盘的场景)