GoogleMap中扩展图形的画法

最新推荐文章于 2024-08-16 18:20:53 发布

pigs2018

最新推荐文章于 2024-08-16 18:20:53 发布

阅读量515

点赞数

分类专栏： gis

本文链接：https://blog.csdn.net/ZHANGHUI3239619/article/details/78746914

版权

gis 专栏收录该内容

24 篇文章 2 订阅

订阅专栏

最近在帮一个朋友在GoogleMap上画扇形，GoogleMap本身不提供这种画法，所以需要自己去实现，无赖原来学过的数学也忘记的差不多了，只能求助网络。

国外有一个高手写了一个扩展，地址是：http://econym.org.uk/gmap/eshapes.htm

但里面没有扇形的画法，在此基础上自己增加了扇形的画法：

GoogleMap中扩展图形的画法

GPolyline扩展方法：

GPolyline.Sector = function(point, radius, sDegree, eDegree, colour, weight, opacity,opts) {
    var points = [];
    var step = ((eDegree - sDegree) / 10) || 10;

    points.push(point);
    for(var i=sDegree;i
        points.push(EOffsetBearing(point,radius,i));
    }
    points.push(point);

    return new GPolyline(points, colour, weight, opacity, opts);
}

GPolygon扩展方法：

GPolygon.Sector = function(point, radius, sDegree, eDegree, strokeColour, strokeWeight,Strokepacity, fillColour, fillOpacity, opts) {
        var points = [];
        var step = ((eDegree - sDegree) / 10) || 10;

        points.push(point);
        for(var i=sDegree;i
            points.push(EOffsetBearing(point,radius,i));
        }
        points.push(point);

        return new GPolygon(points, strokeColour, strokeWeight,Strokepacity, fillColour, fillOpacity, opts);
    }

拓展圆角矩形的方法：

map.addOverlay(GPolyline.Sector(new GLatLng(37.014250000000004,104.24046899999999),30000,-90,0,"#000000",3,1,"#00ff00",0.5));
   map.addOverlay(GPolyline.Sector(new GLatLng(37.014250000000004,105.17796899999999),30000,0,90,"#000000",3,1,"#00ff00",0.5));
   map.addOverlay(GPolyline.Sector(new GLatLng(36.275969,105.17796899999999),30000,90,180,"#000000",3,1,"#00ff00",0.5));
   map.addOverlay(GPolyline.Sector(new GLatLng(36.275969,104.24046899999999),30000,180,270,"#000000",3,1,"#00ff00",0.5));

效果如下：