搜索

百度地图api使用说明

1.引用
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=XDnoAKdX2a603o26ZzRoOXAD"></script>
注:ak需要申请

 

2.定义一块区域显示地图

<style type="text/css">
#allmap {width: 990px;height: 500px;overflow: hidden;margin:0;font-family:"微软雅黑";}
</style>
<div id="allmap"></div>

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=XDnoAKdX2a603o26ZzRoOXAD"></script>
<script type="text/javascript">
// 百度地图
var map = new BMap.Map("allmap"); // 创建Map实例
map.addControl(new BMap.MapTypeControl()); //添加地图类型控件
map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
map.addControl(new BMap.NavigationControl());
//定位到城市
map.centerAndZoom("深圳市", 12);
</script>

 

 

 

3.获取经纬度
map.addEventListener('click', function (e) {
alert(e.point.lng + ', ' + e.point.lat);
});
示例:在上面地图中点击,可获取当前经纬度

 

4.添加标注
var marker = new BMap.Marker(new BMap.Point(114.066793, 22.551127));
var label = new BMap.Label("深圳维修店", { offset: new BMap.Size(20, -10) });
marker.setLabel(label);
map.addOverlay(marker);


示例:查看如上地图

 

5.点击标注显示的信息窗口
marker.addEventListener("click", function () {
var opts = {
width: 100, // 信息窗口宽度
height: 50, // 信息窗口高度
title: "深圳维修店" // 信息窗口标题
}
var infoWindow = new BMap.InfoWindow("深圳的多米可电器维修店", opts); // 创建信息窗口对象
map.openInfoWindow(infoWindow, marker.getPosition()); // 打开信息窗口
});


示例:点击如上地图中的"深圳联华网络"标记

 

6.以经纬度来获取具体地址信息
纬度,经度
http://api.map.baidu.com/geocoder/v2/?ak=XDnoAKdX2a603o26ZzRoOXAD&callback=renderReverse&location=22.551127,114.066793&output=json&pois=1

 

7.根据IP获取所在地区信息
http://api.map.baidu.com/location/ip?ak=XDnoAKdX2a603o26ZzRoOXAD&ip=
--不填写IP默认是本机IP

返回
{"address":"CN|\u5e7f\u4e1c|\u6df1\u5733|None|DXTNET|0|0","content":{"address_detail":{"province":"\u5e7f\u4e1c\u7701","city":"\u6df1\u5733\u5e02","district":"","street":"","street_number":"","city_code":340},"address":"\u5e7f\u4e1c\u7701\u6df1\u5733\u5e02","point":{"y":"2560682.35","x":"12693451.44"}},"status":0}

解析
{"address":"CN| 广东|深圳|None|DXTNET|0|0","content":{"address_detail":{"province":"广东 省","city":"深圳 市","district":"","street":"","street_number":"","city_code":340},"address":" 广东省深圳市","point":{"y":"2560682.35","x":"12693451.44"}},"status":0}

 

8.获取城市天气信息
http://apistore.baidu.com/microservice/weather?cityname=深圳

返回
{"errNum":0,"errMsg":"success","retData":{"city":"\u6df1\u5733","pinyin":"shenzhen","citycode":"101280601","date":"15-12-09","time":"11:00","postCode":"518001","longitude":114.109,"latitude":22.544,"altitude":"40","weather":"\u4e2d\u96e8","temp":"17","l_tmp":"14","h_tmp":"17","WD":"\u65e0\u6301\u7eed\u98ce\u5411","WS":"\u5fae\u98ce(<10m\/h)","sunrise":"06:51","sunset":"17:39"}}

解析
{"errNum":0,"errMsg":"success","retData": {"city":"深 圳","pinyin":"shenzhen","citycode":"101280601","date":"15-12-09","time":"11:00","postCode":"518001","longitude":114.109,"latitude":22.544,"altitude":"40","weather":" 中雨","temp":"17","l_tmp":"14","h_tmp":"17","WD":"无持续风向","WS":"微风 (<10m\/h)","sunrise":"06:51","sunset":"17:39"}}

更新时间:2015-12-23 10:46:52