【BMapGL绘制曲线】

BMapGL绘制曲线

利用鼠标事件和BezierCurve实现在地图上自由绘制曲线
效果如下：

单击绘制，右击消除，
实现代码如下：`function drawcurves()
{
var e1, e2;
var p = []; var path = [];
var curve;
var doneDraw = 0; //判断是否绘制折线结束
var marker2;
map.addEventListener(“click”, function (e1)
{
if (marker2) {map.removeOverlay(marker2);}
if (doneDraw == 0)
{
var point=new BMapGL.Point(e1.latlng.lng, e1.latlng.lat);
var marker_icon = new BMapGL.Icon(“img/circle.png”, new BMapGL.Size(5,5));
marker2 = new BMapGL.Marker(point,{icon:marker_icon});
map.addOverlay(marker2);
path.push(point)

    if( path.length>= 2)       
   {
        var lng0=(path[path.length-1].lng+path[path.length-2].lng)/2
        var lat0=(path[path.length-1].lat+path[path.length-2].lat)/2;
        var point1; 

       if(path[path.length-1].lng==path[path.length-2].lng)
       {
         point1=[new BMapGL.Point(lng0+0.001,lat0)];   
       }
     else if(path[path.length-1].lat==path[path.length-2].lat)
       {
          point1=[new BMapGL.Point(lng0,lat0+0.001)];   
       }
     else
     {  
      var A=-((path[path.length-1].lng-path[path.length-2].lng)/(path[path.length-1].lat-path[path.length-2].lat));
      var B=-1;
      var C=(path[path.length-1].lng-path[path.length-2].lng)/(path[path.length-1].lat-path[path.length-2].lat)*lng0+lat0;
      point1=findSecondPoint(lng0, lat0, 0.001, A, B, C) ;  

     }
     p.push(point1)         
     if (curve) {map.removeOverlay(curve);}
       curve = new BMapGL.BezierCurve(path, p, {
           strokeColor:"red", strokeWeight:3,strokeOpacity:0.5
        });

      map.addOverlay(curve);    
    }          
    }   

});
map.addEventListener(“rightclick”, function (e2)
{
doneDraw = 1;
if (marker2) {map.removeOverlay(marker2);}
map.removeOverlay(curve);
});
}
//drawcurves();

function findSecondPoint(x1, y1, distance, A, B, C) {
const slope = -A / B;
const t = distance / Math.sqrt(1 + slope * slope);
const x2 = x1 + t * (B > 0 ? 1 : -1);
const y2 = y1 - t * A / Math.abs(B);
var point1=[new BMapGL.Point(x2,y2)];
return point1;
}
`