最近在做一个GIS路线查询页面,要用到地图,开始想用GOOGLE,但中国地图还是百度比较详细
第一步:引用百度API的JS库
第二步:创建放置地图的DIV
第三步:创建地图
var map = new BMap.Map("clientmap"); //创建地图实例
到这里就可以开始实现地图,接下来是地图的一些常用操作
map.addControl(new BMap.NavigationControl()); //添加默认缩放平移控件map.addControl(new BMap.ScaleControl()); //添加默认比例尺控件map.addControl(new BMap.OverviewMapControl()); //添加默认缩略地图控件 map.addControl(new BMap.MapTypeControl()); //2D图,卫星图 map.enableScrollWheelZoom(); //启用滚轮放大缩小,默认禁用map.enableContinuousZoom();
地址解析器实例
var myGeo = new BMap.Geocoder(); //创建地址解析器实例myGeo.getPoint(data.rows[i].address, function (point) { // 将地址解析结果显示在地图上,并调整地图视野 if (point) { map.centerAndZoom(point, 10); //设置中心点并按系数放大 }}, "");
创建标注并点击标注弹出信息提示
//信息内容var sContent = "
客户名称: | " + data.rows[i].name + " |
联系人: | " + data.rows[i].linkman + " |
手机号码: | " + data.rows[i].mobile + " |
固定电话: | " + data.rows[i].phone + " |
传真: | " + data.rows[i].fax + " |
Email: | " + data.rows[i].email + " |
客户地址: | " + data.rows[i].address + " |
将折线添加到地图中
var polyline = new BMap.Polyline([points, point]); //折线蓝色、宽度为6map.addOverlay(polyline); // 将折线添加到地图中