企业官网上需要用到地图应用，这里对百度地图API的使用做点笔记，好记性不如烂笔头。
实现地图应用的流程如下：
1、获取密钥；教程网址/article/363872eccda8286e4aa16f4e.html
2、在html的head头部引入百度地图的API，如
<script type="text/javascript" src="http://api./api?v=2.0&ak=您的密钥"></script>
3、根据API文档创建容器、绘制地图、添加各种控件。详细如下代码
<div id="mapContainer" style="width:500px;height:400px;border:1px solid gray;"></div>
<script>function initialize() {//创建地图实例var map = new BMap.Map('mapContainer'); //地图渲染到了id="mapContainer"的DOM元素上//创建一个坐标var point =new BMap.Point(113.946567,22.531604);//地图初始化，设置中心点坐标和地图级别map.centerAndZoom(point,14);var myIcon = new BMap.Icon("http://api./img/markers.png", new BMap.Size(23, 25)); //替换掉标注的图片var marker = new BMap.Marker(point,{icon: myIcon}); // 创建标注map.addOverlay(marker); // 将标注添加到地图中map.enableScrollWheelZoom(); // 启用滚轮放大缩小。//map.enableKeyboard(); // 启用键盘操作。map.addControl(new BMap.NavigationControl()); // 添加平移缩放控件map.addControl(new BMap.ScaleControl({anchor : BMAP_ANCHOR_BOTTOM_RIGHT, //右下角offset : new BMap.Size(290,10) //进一步控制缩放按钮的水平竖直偏移量})); // 添加比例尺控件map.addControl(new BMap.OverviewMapControl({isOpen:true})); //添加缩略地图控件map.addControl(new BMap.MapTypeControl( {anchor : BMAP_ANCHOR_BOTTOM_RIGHT, //右下角offset : new BMap.Size(160,10) //进一步控制缩放按钮的水平竖直偏移量})); //地图类型var label = new BMap.Label("深圳赛动生物自动化有限公司",{offset:new BMap.Size(15,-20)});marker.setLabel(label); //添加公司label}window.onload = initialize;</script>
开发中遇到的一些问题的记录：
1、如何获取目标点的坐标点（地图中心点，比如公司位置坐标）？？百度地图提供了一个坐标拾取器工具界面，可以参考使用教程获取：/article/f96699bbafdccc894e3c1b8b.html
2、默认是没有鼠标滚动缩放大小、平移缩放、缩略地图、比例尺、标注、三维地图类型等功能，需要如上述代码分别添加。
3、如何隐藏左下角地图的版权信息？？如下
<style>.anchorBL{display:none;}</style>
4、在标注旁显示公司名的标注，更换标注的图标
var label = new BMap.Label("深圳赛动生物自动化有限公司",{offset:new BMap.Size(15,-20)});marker.setLabel(label); //添加公司labelvar myIcon = new BMap.Icon("http://api./img/markers.png", new BMap.Size(23, 25));var marker2 = new BMap.Marker(point, {icon: myIcon}); map.addOverlay(marker2);
5、右下角的缩略地图是折叠的，怎么保持常开？？
map.addControl(new BMap.OverviewMapControl({isOpen:true})); //添加缩略地图控件
6、百度离线地图开发待完善？？
百度地图API使用官网：/index.php?title=jspopular/guide/maplayer
网络教程参考网址：/yfsmooth/p/4695831.html
这里附加一个迅速地图实现的工具：http://api./lbsapi/creatmap/index.html可以直接配置参数获取代码
