Редактор ломаной
Для ломаных доступен визуальный редактор. Ссылка на редактор содержится в поле editor объекта-ломаной.
index.html
polylineEditor.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="polylineEditor.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.72, 37.64],
zoom: 10,
},
{
searchControlProvider: "yandex#search",
}
);
// Создаем ломаную.
var myPolyline = new ymaps.Polyline(
[
// Указываем координаты вершин.
[55.8, 37.5],
[55.8, 37.4],
[55.7, 37.5],
[55.7, 37.4],
],
{},
{
// Задаем опции геообъекта.
// Цвет с прозрачностью.
strokeColor: "#00000088",
// Ширину линии.
strokeWidth: 4,
// Максимально допустимое количество вершин в ломаной.
editorMaxPoints: 6,
// Добавляем в контекстное меню новый пункт, позволяющий удалить ломаную.
editorMenuManager: function (items) {
items.push({
title: "Удалить линию",
onClick: function () {
myMap.geoObjects.remove(myPolyline);
},
});
return items;
},
}
);
// Добавляем линию на карту.
myMap.geoObjects.add(myPolyline);
// Включаем режим редактирования.
myPolyline.editor.startEditing();
}