百度地图API简单使用

时间:2023-03-10 00:17:26
百度地图API简单使用

百度地图API是由JavaScript语言编写的,在使用之前需要将API引用到页面中:  现在新版本的需要密钥,下面用的是旧版的

<script src="http://api.map.baidu.com/api?v=版本&services=true或者false" type="text/javascript"></script>

显示广州火车站简单实例:

百度地图API简单使用

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>百度地图API的使用</title>
<!-- 百度地图API-->
<script src="http://api.map.baidu.com/api?v=1.2" type="text/javascript"></script>
<script type="text/javascript">
function initialize() {
//创建地图实例
var map = new BMap.Map('map');
//创建一个坐标
var point =new BMap.Point(113.264641,23.154905);
//地图初始化,设置中心点坐标和地图级别
map.centerAndZoom(point,15);
}
window.onload = initialize;
</script>
</head>
<body>
<!-- 百度地图地图容器-->
<div id="map" style="width:500px;height:320px"></div>
</body>
</html>

地图上添加控件:

百度地图API简单使用

//添加控件
map.addControl(new BMap.MapTypeControl());

MapTypeControl ---------地图类型控件

CopyrightControl --------版权控件

ScaleControl       --------比例尺控件

NavigationControl  ------缩放控件

OverviewMapControl  ----缩略图控件

创建标注:

百度地图API简单使用

var marker = new BMap.Marker(point);        // 创建标注
map.addOverlay(marker); // 将标注添加到地图中

创建信息窗口:

百度地图API简单使用

var infoWindow = new BMap.InfoWindow("I am here");    // 创建信息窗口对象
map.openInfoWindow(infoWindow,point); //开启信息窗口

百度地图偏移量:

经度校正值: 0.008774687519;

纬度校正值: 0.00374531687912;

更多请参考百度开放文档:

http://developer.baidu.com/map/jsdemo.htm#a1_2