Редактор круга
Для круга доступен визуальный редактор. Через визуальное редактирование можно изменять радиус круга. Ссылка на редактор содержится в поле editor объекта-круга.
index.html
circleEditor.js
<!DOCTYPE html>
<html>
<head>
<title>Редактор круга</title>
<meta
http-equiv="Content-Type"
content="text/html; charset=utf-8"
/>
<!--
Укажите свой API-ключ. Тестовый ключ НЕ БУДЕТ работать на других сайтах.
Получить ключ можно в Кабинете разработчика: https://developer.tech.yandex.ru/keys/
-->
<script
src="https://api-maps.yandex.ru/2.1/?lang=ru_RU&apikey=<ваш API-ключ>"
type="text/javascript"
></script>
<script src="circleEditor.js" type="text/javascript"></script>
<style>
html,
body,
#map {
width: 100%;
height: 100%;
padding: 0;
margin: 0;
}
</style>
</head>
<body>
<div id="map"></div>
</body>
</html>
ymaps.ready(init);
function init() {
// Создаем карту.
var myMap = new ymaps.Map(
"map",
{
center: [55.76, 37.64],
zoom: 10,
controls: [],
},
{
searchControlProvider: "yandex#search",
}
);
// Создаем круг.
var myCircle = new ymaps.Circle(
[
// Координаты центра круга.
[55.76, 37.6],
// Радиус круга в метрах.
10000,
],
{},
{
// Задаем опции круга.
// Цвет заливки.
fillColor: "#DB709377",
// Цвет обводки.
strokeColor: "#990066",
// Прозрачность обводки.
strokeOpacity: 0.8,
// Ширина обводки в пикселях.
strokeWidth: 5,
}
);
// Добавляем круг на карту.
myMap.geoObjects.add(myCircle);
// Включаем редактирование круга.
myCircle.editor.startEditing();
}