html5实现地图上定位导航路线
比如我的一个普通的webapp网站,手机地图上能自动定位我当前的位置,并能够显示出我当前位置离所在目标的具体路线,这样用html5可以实现吗,还是说一定要用ios开发才行...
比如我的一个普通的webapp网站,手机地图上能自动定位我当前的位置,并能够显示出我当前位置离所在目标的具体路线,这样用html5可以实现吗,还是说一定要用ios开发才行
展开
3个回答
展开全部
html5实现地图上定位导航路线方法如下:
1.先通过百度拾取坐标系统获得点位的坐标。
http://api.map.baidu.com/lbsapi/getpoint/index.html
2.在网页的<head>中插入百度API引用脚本。
<script type="text/javascript" src="http://api.map.baidu.com/api
key=&v=1.1&services=true"></script>
3.在网页的</body>之后</html>之前插入地图显示代码。
4.设置显示地图的div的id为“dituContent”,即添加 id="dituContent"
由于jqm的div的高度都是根据内容自由放大的,所以为了地图能正常显示,还需要
增加一个高度值,一般情况600px就可以,完成。
云里物里
2024-12-19 广告
2024-12-19 广告
基于蓝牙定位的系统里,经常有两个名词概念经常被提起,那就是信标(Beacon)和标签(Tag);标签和信标都是定位系统中使用的蓝牙设备的常用术语。在一些情况它们的功能相似,都可以用于定位和追踪位置信息。但是既然会有两个不同的称呼,那么也会一...
点击进入详情页
本回答由云里物里提供
展开全部
HTML5+JQM即可实现
参考方法:
1.先去通过百度拾取坐标系统获得点位的坐标
http://api.map.baidu.com/lbsapi/getpoint/index.html
2.在网页的<head>中插入百度API引用脚本。
<script type="text/javascript" src="http://api.map.baidu.com/api?
key=&v=1.1&services=true"></script>
3.在网页的</body>之后</html>之前插入地图显示代码
4.设置显示地图的div的id为“dituContent”,即添加 id="dituContent"
由于jqm的div的高度都是根据内容自由放大的,所以为了地图能正常显示,还需要
增加一个高度值,一般情况600px就可以
注意事项:
1. var point = new BMap.Point(120.524011,36.395728); 这是定义中心店坐标
2. map.centerAndZoom(point,15); 这个据我调试 应该是控制地图比例缩放的
3. window.setTimeout(function(){map.panTo(point);}, 1000);注意了 一般的
demo是没有这个东西滴,所以呢当跳转到地图的页面时候 是不会显示你定位的中心
点的 但是由于我的聪明和机智 各种装孙子求助大神 才得知了这个大神不削一顾
的属性 :设定地图加载后1秒调至中心点 。。最后强调下
低调 一定要低调。。。
4. function createIcon(json){
var icon = new BMap.Icon("images/map_icon.png", new BMap.Size
(json.w,json.h),{imageOffset: new BMap.Size(-json.l,-
json.t),infoWindowOffset:new BMap.Size(json.lb+5,1),offset:new BMap.Size
(json.x,json.h)})
return icon;
} 这里就是创建一个icon
5. var markerArr = [{title:"西程村",content:"青岛市即墨市蓝鳌路 电话:
123123123213",point:"120.524011|36.395728",isOpen:0,icon:
{w:32,h:32,l:0,t:0,x:6,lb:5}}]; 这里呢 就是设置定位的信息
参考方法:
1.先去通过百度拾取坐标系统获得点位的坐标
http://api.map.baidu.com/lbsapi/getpoint/index.html
2.在网页的<head>中插入百度API引用脚本。
<script type="text/javascript" src="http://api.map.baidu.com/api?
key=&v=1.1&services=true"></script>
3.在网页的</body>之后</html>之前插入地图显示代码
4.设置显示地图的div的id为“dituContent”,即添加 id="dituContent"
由于jqm的div的高度都是根据内容自由放大的,所以为了地图能正常显示,还需要
增加一个高度值,一般情况600px就可以
注意事项:
1. var point = new BMap.Point(120.524011,36.395728); 这是定义中心店坐标
2. map.centerAndZoom(point,15); 这个据我调试 应该是控制地图比例缩放的
3. window.setTimeout(function(){map.panTo(point);}, 1000);注意了 一般的
demo是没有这个东西滴,所以呢当跳转到地图的页面时候 是不会显示你定位的中心
点的 但是由于我的聪明和机智 各种装孙子求助大神 才得知了这个大神不削一顾
的属性 :设定地图加载后1秒调至中心点 。。最后强调下
低调 一定要低调。。。
4. function createIcon(json){
var icon = new BMap.Icon("images/map_icon.png", new BMap.Size
(json.w,json.h),{imageOffset: new BMap.Size(-json.l,-
json.t),infoWindowOffset:new BMap.Size(json.lb+5,1),offset:new BMap.Size
(json.x,json.h)})
return icon;
} 这里就是创建一个icon
5. var markerArr = [{title:"西程村",content:"青岛市即墨市蓝鳌路 电话:
123123123213",point:"120.524011|36.395728",isOpen:0,icon:
{w:32,h:32,l:0,t:0,x:6,lb:5}}]; 这里呢 就是设置定位的信息
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询