天天看点

百度地图JSAPI GL镂空多边形绘制

1.先看官方代码

转自:loukongPolygon | 百度地图API SDK (baidu.com)

var bd = new BMapGL.Boundary();
    bd.get('顺义区', function (rs) {
        // console.log('外轮廓:', rs.boundaries[0])
        // console.log('内镂空:', rs.boundaries[1])
        var hole = new BMapGL.Polygon(rs.boundaries, {
            fillColor: 'blue',
            fillOpacity: 0.2
        });
        map.addOverlay(hole);
    });
           

2.自定义范围绘制镂空面

let bounds = [];
        bounds[0] = '100.25209108920284,50.17700709455162;' +
                    '140.25209108920284,50.17700709455162;' +
                    '140.25209108920284,30.17700709455162;' +
                    '100.25209108920284,30.17700709455162';
        bounds[1] = '110.25209108920284,45.17700709455162;' +
                    '130.25209108920284,45.17700709455162;' +
                    '130.25209108920284,35.17700709455162;' +
                    '110.25209108920284,35.17700709455162';
        var polygon = new BMapGL.Polygon(bounds, {
            fillColor: 'blue',
            fillOpacity: 0.2
        });
        map.addOverlay(polygon);
           

总结:

百度地图api的polygon构造函数

BMapGL.Polygon(points:Array< Point >, options)

points参数可以是字符串数组

继续阅读