百度地图叠加扇形区域，也可以做成异性区域 

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
        body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=uIGNq6dLthEQ5iM5G8mNfCl1BDDfWx9d"></script>
    <title>地图展示</title>
</head>
<body>
<div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
    // 百度地图API功能
    var map = new BMap.Map("allmap");
    var point = new BMap.Point(116.404, 39.915);
    map.centerAndZoom(point, 13);
    map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
    var markers = [];
    function Sector1(point2, radius, sDegree, eDegree, strokeColour, strokeWeight, Strokepacity, fillColour, fillOpacity, opts) {
        var points = [];
        var step = ((eDegree - sDegree) / 4) || 4;
        points.push(point2);
        for ( var i = sDegree; i < eDegree + 0.01; i += step) {
            points.push(EOffsetBearing(point2, radius, i));
        }
        points.push(point2);
        var polygon = new BMap.Polygon(//Polygon方法接受大量点后，可以合成任意图形
                points
                , {strokeColor:strokeColour, strokeWeight:strokeWeight, strokeOpacity:Strokepacity, fillColor: fillColour, fillOpacity:fillOpacity});

        return polygon;
    }

    function EOffsetBearing(point3, dist, bearing) {
        var latConv = map.getDistance(point3, new BMap.Point(point3.lng + 0.1, point3.lat)) * 5;
        var lngConv = map.getDistance(point3, new BMap.Point(point3.lng, point3.lat + 0.1)) * 3;
        var lat = dist * Math.cos(bearing * Math.PI / 180) / latConv;
        var lng = dist * Math.sin(bearing * Math.PI / 180) / lngConv;
        return new BMap.Point(point3.lng + lng, point3.lat + lat);
    }

    var points = new BMap.Point(116.404, 39.915);
    var polygon2 = Sector1(points, 4000, 0, 90, "#000000", 3, 0.5, "#00ff00", 0.5);
    map.addOverlay(polygon2);
    var polygon2 = Sector1(points, 4000, 90, 180, "#000000", 3, 0.5, "#00ff00", 0.5);
    map.addOverlay(polygon2);
    var polygon2 = Sector1(points, 4000, 180, 270, "#000000", 3, 0.5, "#00ff00", 0.5);
    map.addOverlay(polygon2);
    var polygon2 = Sector1(points, 4000, 270, 360, "#000000", 3, 0.5, "#00ff00", 0.5);
    map.addOverlay(polygon2);
    
</script>

 

posted @ 2016-05-05 08:57  刘金宇  阅读(1853)  评论(0)    收藏  举报