我在地图上使用对象,例如圆(Circle(,当地图放大时,我需要它们的大小保持不变。有办法实现这个结果吗?
下面是代码;圆圈";类型,半径为1000米:
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);
}
}
但是,它们是否有可能以像素为单位具有固定的半径,或者相对于窗口,但不相对于地图?感谢您的关注
你可以试试这个
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>