Baidu Map Js使用说明

lbs

1. 画覆盖物相关

Map(container:String|HTMLElement[,opts:MapOptions])

在指定的容器内创建地图实例，之后需要调用Map.centerAndZoom()方法对地图进行初始化。未进行初始化的地图将不能进行任何操作

判断点是否在覆盖物内需要引用GeoUtils类
几何运算

实例:

var map = new BMap.Map("container");
var pt = new BMap.Point(116.404, 39.915);
map.centerAndZoom(pt, 16);

常用方法

map.enableScrollWheelZoom();//开启滚动缩放
map.enableContinuousZoom();//开启缩放平滑
map.clearOverlays(); //清除地图上所有覆盖物

在地图上添加点

var pt = new BMap.Point(116.398, 39.915);//测试点
var mkr = new BMap.Marker(pt);
map.addOverlay(mkr);//添加测试点

在地图上画矩形

var pt1 = new BMap.Point(116.400, 39.910);//西南脚点
var pt2 = new BMap.Point(116.410, 39.920);//东北脚点

var leftTop = new BMap.Point(pt1.lng, pt2.lat);
var rightTop = new BMap.Point(pt2.lng, pt2.lat);
var leftBottom = new BMap.Point(pt1.lng, pt1.lat);
var rightBottom = new BMap.Point(pt2.lng, pt1.lat);

var pts = [];
pts.push(leftTop);
pts.push(rightTop);
pts.push(rightBottom);
pts.push(leftBottom);
var rect = new BMap.Polygon(pts);
map.addOverlay(rect);//添加测试矩形   

判断点是否在矩形内

var bds = new BMap.Bounds(pt1, pt2); //测试Bounds对象
var result = BMapLib.GeoUtils.isPointInRect(pt, bds);

result: true 在矩形内,false 不在矩形内

在地图上画圆形

Circle(center:Point, radius: Number[, opts:CircleOptions])

var c = new BMap.Point(116.404, 39.915); //圆心 
var circle = new BMap.Circle(c, 500);//测试圆 500为半径  
map.addOverlay(circle);

判断点是否在圆形内

var result = BMapLib.GeoUtils.isPointInCircle(pt, circle);

在地图上画多边形

Polygon(points:Array[, opts:PolygonOptions]) //创建多边形覆盖物

 var pts = [];
 var pt1 = new BMap.Point(116.395, 39.910);
 var pt2 = new BMap.Point(116.394, 39.914);
 var pt3 = new BMap.Point(116.403, 39.920);
 var pt4 = new BMap.Point(116.402, 39.914);
 var pt5 = new BMap.Point(116.410, 39.913);    

 pts.push(pt1);
 pts.push(pt2);
 pts.push(pt3);
 pts.push(pt4);
 pts.push(pt5);  
 var ply = new BMap.Polygon(pts);

map.addOverlay(ply); 

判断点是否在多边形内

var result = BMapLib.GeoUtils.isPointInPolygon(pt, ply);

2.右键菜单相关

删除覆盖物

map.removeOverlay(marker);

给覆盖物添加右键菜单

    var map = new BMap.Map("allmap");
    var point = new BMap.Point(116.404, 39.915);
    map.centerAndZoom(point,15);

    var removeMarker = function(e,ee,marker){
        map.removeOverlay(marker);
    }
    //创建右键菜单
    var markerMenu=new BMap.ContextMenu();
    markerMenu.addItem(new BMap.MenuItem('删除',removeMarker.bind(marker)));

    var marker = new BMap.Marker(point);
    map.addOverlay(marker);
    marker.addContextMenu(markerMenu);