QQ 地图根据地理坐标确定地图中心位置

根据地理坐标确定地图中心位置

Html 代码

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5     <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
 6 <title>指定地理坐标定位</title>
 7 <style type="text/css">
 8 *{
 9     margin:0px;
10     padding:0px;
11 }
12 body, button, input, select, textarea {
13     font: 12px/16px Verdana, Helvetica, Arial, sans-serif;
14 }
15 p{
16     width:603px;
17     padding-top:3px;
18     overflow:hidden;
19 }
20 </style>
21 <script charset="utf-8" src="http://map.qq.com/api/js?v=2.exp"></script>
22 <script>
23 var citylocation,map,marker = null;
24 var init = function() {
25     var center = new qq.maps.LatLng(39.916527,116.397128);
26     var city = document.getElementById("city");
27     map = new qq.maps.Map(document.getElementById('container'),{
28         center: center,
29         zoom: 13
30     });
31     citylocation = new qq.maps.CityService({
32         complete : function(results){
33             map.setCenter(results.detail.latLng);
34             city.style.display = 'inline';
35             city.innerHTML = '所在位置: ' + results.detail.name;
36             
37             if (marker != null) {
38                 marker.setMap(null);
39             }
40             marker = new qq.maps.Marker({
41                 map: map,
42                 position: results.detail.latLng
43             });
44         }
45     });
46 
47     citylocation.searchCityByLatLng(center);
48 }
49 
50 function geolocation_latlng() {
51     
52 }
53 </script>
54 </head>
55 <body onload="init()">
56 <div>
57     <input id="latLng" type="textbox" value="39.89477,116.35432">
58     <input type="button" value="search" onclick="geolocation_latlng()">
59     <span style="height:30px;display:none" id="city"></span>
60 </div>
61 <div style="width:603px;height:300px" id="container"></div>
62 <p>根据地理坐标确定地图中心位置。</p>
63 </body>
64 </html>

腾讯地图开放平台 JavaScript API V2

http://lbs.qq.com/javascript_v2/index.html

posted @ 2015-07-30 10:49  壬子木  阅读(710)  评论(0)    收藏  举报