1. 程式人生 > >map2.0簡單應用

map2.0簡單應用

tex return 失敗 tlab gin win 添加 var PE

<html>
<head>

<meta content="yes" name="apple-mobile-web-app-capable"> <meta name="viewport" content="width=device-width,height=device-height,inital-scale=0.4,maximum-scale=0.4,user-scalable=no;">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <!-- <link rel="stylesheet" type="text/css" href="/stylesheets/css.css" title="default" /> -->

<title>確認到達</title>

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=3rKIUIFBd3VXbc1gxObITON9"></script> <script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script> </head> </head>
<body>
<!-- 騰訊定位(json地址) --> <!-- <div id="pos-area" style=‘width:80%;hight:400px‘; margin-left:10%; font-size:40px;> <p id="demo" style="font-size:40px;margin-left:2%;">點擊下面的按鈕,獲得對應信息:<br /></p> </div>

<div id="btn-area"> <button style="font-size:40px;margin-left:2%;" onclick="geolocation.getLocation(showPosition, showErr, options)">獲取精確定位信息</button> </div> <script type="text/javascript" src="https://3gimg.qq.com/lightmap/components/geolocation/geolocation.min.js"></script> <script type="text/JavaScript"> var geolocation = new qq.maps.Geolocation("OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77", "myapp"); var positionNum = 0; var options = {timeout: 8000}; function showPosition(position) { positionNum++; document.getElementById("demo").appendChild(document.createElement(‘pre‘)).innerHTML = JSON.stringify(position, null, 4); }; function showErr() { positionNum++; document.getElementById("demo").innerHTML += "序號:" + positionNum; document.getElementById("demo").appendChild(document.createElement(‘p‘)).innerHTML = "定位失敗!"; }; </script>-->




<div id="status" style="text-align: center"></div> <div style="width:96%;height:800px;border:1px solid gray;margin:30px auto" id="container"></div> <script type="text/javascript"> //默認地理位置設置為成都市高升橋 var x = 104, y = 30; window.onload = function () { if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition); // 百度地圖API功能
var map = new BMap.Map("container"); var point = new BMap.Point(x, y); map.centerAndZoom(point, 16);
var geolocation = new BMap.Geolocation(); geolocation.getCurrentPosition(function (r) { if (this.getStatus() == BMAP_STATUS_SUCCESS) { var mk = new BMap.Marker(r.point); map.addOverlay(mk); var labelgg = new BMap.Label("我的位置", { offset: new BMap.Size(20, -10) }); mk.setLabel(labelgg); //添加GPS label debugger var ggPoint = new BMap.Point(105, 32); var markergg = new BMap.Marker(ggPoint); map.addOverlay(markergg); //添加GPS marker var labelgg = new BMap.Label("他的位置", { offset: new BMap.Size(20, -10) }); markergg.setLabel(labelgg); //添加GPS label //map.panTo(r.point); } else { alert(‘failed‘ + this.getStatus()); } }, { enableHighAccuracy: true }) return; } alert("你的瀏覽器不支持獲取地理位置!"); }; function showPosition(position) { x = position.coords.longitude; y = position.coords.latitude;
setTimeout(function () { var gpsPoint = new BMap.Point(x,y); BMap.Convertor.translate(gpsPoint, 0, function (point) { var geoc = new BMap.Geocoder(); geoc.getLocation(point, function (rs) { // var addComp = rs.addressComponents; // alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber); }); }); }, 1000); } </script> </body>
</html>

map2.0簡單應用