获取百度地图

来源:互联网 发布:linux服务器端口开放 编辑:程序博客网 时间:2024/06/06 03:51

一.获取百度地图


需要调用百度的js

<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script> 
<script type="text/javascript" src="http://api.map.baidu.com/library/CityList/1.2/src/CityList_min.js"></script>


<!DOCTYPE HTML><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><style type="text/css">html,body,div,ul,li{margin: 0;padding: 0;}a{text-decoration: none;} .maps_bg{width: 600px;height: 289px;}</style></head><body><div class="maps_bg" id="container"> </div> <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script> <script src="http://api.map.baidu.com/library/CityList/1.2/src/CityList_min.js"></script><script type="text/javascript">   var map = new BMap.Map("container");     map.centerAndZoom(new BMap.Point(117.10, 40.13), 11);     map.addControl(new BMap.NavigationControl());     map.addControl(new BMap.ScaleControl());     map.addControl(new BMap.OverviewMapControl());     map.addControl(new BMap.MapTypeControl());     //搜索     // 创建地址解析器实例     var myGeo = new BMap.Geocoder();     var searchTxt = '福建省福州市鼓楼区铜盘路软件大道89号福州软件园D区';     // 将地址解析结果显示在地图上,并调整地图视野     myGeo.getPoint(searchTxt, function (point) {         if (point) {         map.centerAndZoom(point, 16);         var pointMarker = new BMap.Point(point.lng, point.lat);         geocodeSearch(pointMarker);         map.addOverlay(new BMap.Marker(point));         }         else         alert("搜索不到结果");         }, "全国");     map.enableScrollWheelZoom();     // 创建CityList对象,并放在citylist_container节点内     var myCl = new BMapLib.CityList({ container: "citylist_container", map: map });     // 给城市点击时,添加相关操作     myCl.addEventListener("cityclick", function (e) {     // 修改当前城市显示     document.getElementById("curCity").innerHTML = e.name;     // 点击后隐藏城市列表     document.getElementById("cityList").style.display = "none";     });     map.addEventListener("click", function (e) {         document.getElementById("txtlatitude").value = e.point.lat;         document.getElementById("txtLongitude").value = e.point.lng;         map.clearOverlays();         var pointMarker = new BMap.Point(e.point.lng, e.point.lat); // 创建标注的坐标         addMarker(pointMarker);         geocodeSearch(pointMarker);     });     function addMarker(point) {         var myIcon = new BMap.Icon("mk_icon.png", new BMap.Size(21, 25),         { offset: new BMap.Size(21, 21),         imageOffset: new BMap.Size(0, -21)          });         var marker = new BMap.Marker(point, { icon: myIcon });         map.addOverlay(marker);     }     function geocodeSearch(pt) {         var myGeo = new BMap.Geocoder();         myGeo.getLocation(pt, function (rs) {         var addComp = rs.addressComponents;         });     }</script></body></html>


原创粉丝点击