在图像图层OpenLayers 2中以EPSG:4326坐标中心绘制圆

我试图在JPG文件的图像层中创建一个像var center = {lat: 12.972876848034, lng: 77.589721116026}这样的中心的圆圈(我在Google地图上捡起这一点)。但是圆圈没有出现

这是我的代码。

<!DOCTYPE html>
<html>
<head>
    <script src="http://openlayers.org/api/OpenLayers.js"></script>
    <script type="text/javascript">
        var map;
        function init() {
            var imgWidth = 1864;
            var imgHeight = 1070;
            var extend = new OpenLayers.Bounds(77.58356602859499, 12.965959702159019, 77.6046633014679, 12.976413580812167); 
            var layer = new OpenLayers.Layer.Image(
                'Image layer',
                'images/view.jpg',
                extend,
                new OpenLayers.Size(imgWidth, imgHeight),
                {numZoomLevels: 6}
            );
            map = new OpenLayers.Map(
            {
                div: "mapdiv",
                maxExtent: extend,
                maxResolution: 156543,
                numZoomLevels: 6
            }
            );
            map.addLayers([layer]);
            map.zoomToMaxExtent();
            var center = {lat: 12.972876848034, lng: 77.589721116026}
            var lonLat = new OpenLayers.LonLat(center.lng, center.lat)
            var pCenter = new OpenLayers.Geometry.Point(lonLat.lon, lonLat.lat);
            var circle = OpenLayers.Geometry.Polygon.createRegularPolygon(pCenter, 50, 70, 0);
            var circleFeature = new OpenLayers.Feature.Vector(circle);
            var circleStyle = new OpenLayers.StyleMap({'strokeColor': '#1E88E5', 'strokeWidth': 2});
            var circleLayer = new OpenLayers.Layer.Vector("Route Layer", {styleMap: circleStyle});
            circleLayer.addFeatures([circleFeature]);
        }
        init();
    </script>
</head>
<body onload="init()">
    <div style="height: 100vh" id="mapdiv"></div>
</body>

这是如何引起的，我该如何解决?谢谢大家的建议

我找到答案了，因为我用的是EPSG:4326坐标，半径的单位必须是度。我设置了radius = 0.1，现在它工作了

相关内容

最新更新

热门标签：