轉自:http://zhidao.baidu.com/link?url=u_HYWgKERQvi6luDE3jdKcJM3ybb8bWkedrXne4ckR99b6riJ0mmKEAkwJ3a9Q8o38ieEqHtnvaqoclLtEdOO6_Vtb33LmtY8-uS-11q47i
關于 導航路 的問題
比如我的一個普通的webapp網站,手機地圖上能自動定位我目前的位置,并能夠顯示出我目前位置離所在目标的具體路線,這樣用html5可以實作嗎,還是說一定要用ios開發才行
分享到: 2014-08-27 13:59 提問者采納
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}}]; 這裡呢 就是設定定位的資訊
- 提問者評價
-
謝謝你寫得這麼詳細