0

我在地图上使用对象，例如圆圈 (Circle)，我需要它们的大小在地图放大时保持不变。有没有办法实现这个结果？

下面是创建“Circle”类型对象的代码，半径为 1000 m：

const { data } = this;
const ymaps = window.ymaps;
ymaps.ready(init);
function init() {
  var myMap = new ymaps.Map('map', {
    center: [43.00, 40.97],
    zoom: 9
  });

  let circle;

  for (let x = 0; x < data.length; x++) {
    circle = new ymaps.Circle([[data[x].coordx, data[x].coordy], 1000], {}, {
      fillColor: '#DB709377',
      strokeColor: '#990066',
      strokeOpacity: 0.8,
      strokeWidth: 1,
    });
    myMap.geoObjects.add(circle);
  }
}

但是它们是否有可能具有以像素为单位的固定半径，或者相对于窗口，而不是相对于地图？感谢您的关注

4

1 回答 1

1

你可以试试这个

var precision = 30;
var map;
var points = [];
var polygon;

function init() {
    map = new ymaps.Map("map", {
      center: [51.50, -0.12],
      zoom: 10
    });
    // вычисляем точки полигона в глобальных координатах
    var zoom = map.getZoom();
    var projection = map.options.get('projection');
    
    var center = projection.toGlobalPixels([51.50, -0.12], zoom);
    var radius = 120;
    var start = 0;
    var end = Math.PI * 2;

    var delta = end - start;
    var step = delta / precision;

        points.push(center);
    for(var i = 0; i <= delta + step; i += step){
      points.push([
        center[0] + radius * Math.cos(start + i),
        center[1] + radius * Math.sin(start + i)
       ]);
    }
    points.push(center);
    points = points.map(function (point) {
            return projection.fromGlobalPixels(point, zoom);
    });

    polygon = new ymaps.Polygon([points]);
  
    map.geoObjects.add(polygon);
}

ymaps.ready(init);
</style>

<style>
        html, body {
            width: 100%; height: 100%; padding: 0; margin: 0;
            font-family: Arial;
        }

        #map {
            width: 100%;
            height: 80%;
        }

        .header {
            padding: 5px;
        }
<div id="map"></div>
<script type="text/javascript" src="https://api-maps.yandex.ru/2.1/?lang=en_US&apikey=7b1b79b3-8fad-410d-9704-a6f542e7a6bd"></script>

于 2020-10-24T13:33:18.343 回答