缩放地图时 Openlayers 几何形状不缩放

Question

我已经用 Openlayers 绘制了一个圆形几何图形，该圆形显示在地图中，但是当我缩放地图时，该圆形没有被放大，它保持相同的半径，在每个缩小级别变得更小

我已经按照下面的方式绘制了圆形几何图形

var circleFeature = new ol.Feature
    ({
      geometry: new ol.geom.Circle([0, 0], 5)
    });

circleStyle = new ol.style.Style({
      image: new ol.style.Circle({
          radius: 5,
          fill: null,
          zIndex: 3,
          stroke: new ol.style.Stroke({
              color: '#FF0000',
              width: 2
          })
      })     
    });

我希望圆（或任何几何图形）能够像在 https://openlayers.org/en/latest/examples/draw-shapes.html 中那样缩放。但就我而言，它不起作用

Answer 1

使用

设置样式

 new ol.style.Style({
          fill: null,
          zIndex: 3,
          stroke: new ol.style.Stroke({
              color: '#FF0000',
              width: 2
          })
    });

ol.style.Circle 用于为具有圆形图像的点等特征设置样式，半径以像素为单位，因此不会随缩放而改变。

Answer 2

您添加了圆圈作为标记，所以它不会起作用。根据您的需要，您需要添加圆圈属性 class.

试试这个

var centerLongitudeLatitude = ol.proj.fromLonLat([23.0225,72.5714]);
var layer = new ol.layer.Vector({
  source: new ol.source.Vector({
    projection: 'EPSG:4326',
    features: [new ol.Feature(new ol.geom.Circle(centerLongitudeLatitude, 400000))]
  }),
  style: [
    new ol.style.Style({
      stroke: new ol.style.Stroke({
        color: 'blue',
        width: 3,
        opacity:0.6,
         brightness: 0.2
      }),
      fill: new ol.style.Fill({
        color: 'rgba(0, 0, 255, 0.1)'
      })
    })
  ]
});

这里400000=400000米

缩放地图时 Openlayers 几何形状不缩放

Openlayers geometry shapes not zooming when map is zoomed

javascript

geometry

zooming

openlayers