首页 > 其他 > 详细

openlayers绘制圆形的几种方式

时间:2020-11-29 14:37:52      阅读:644      评论:0      收藏:0      [点我收藏+]

情况说明:1、底图坐标系为EPSG:4326;2、根据给定的中心点坐标和半径绘制圆形;

方式一:利用ol api 把半径米单位转换为EPSG:4326坐标系上的单位,代码如下:

//绘制圆形缓冲区
        var metersPerUnit = map.getView().getProjection().getMetersPerUnit();
        var circleRadius = radius / metersPerUnit;
        var circle = new ol.geom.Circle(center, circleRadius);
        var polygon = new ol.geom.Polygon.fromCircle(circle);//转换为polygon,用于空间查询
        var circleFeature = new ol.Feature({
            geometry: polygon,
        });
效果图:技术分享图片
方式二:先绘制坐标系为EPSG:3857下的圆形,再进行坐标转换,代码如下:
       var _center = ol.proj.transform(center, "EPSG:4326", "EPSG:3857");
        var circle = new ol.geom.Circle(_center, radius);
        var polygon = new ol.geom.Polygon.fromCircle(circle);//用于空间查询geometry传递
        polygon = polygon.clone().transform("EPSG:3857", "EPSG:4326");
        var circleFeature = new ol.Feature({
            geometry: polygon,
        });
效果图:
技术分享图片

 

方式三:利用开源turf.js 进行绘制,代码如下:

        var options = { units: "meters" };
        var circle = turf.circle(center, radius, options);
        var circleFeature = new ol.format.GeoJSON().readFeature(circle);
技术分享图片

 

 

openlayers绘制圆形的几种方式

原文:https://www.cnblogs.com/gislover/p/14056128.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!