JSFiddle - React, Tailwind, and code Playground

by CostaConquesta

HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
    <script src="http://api-maps.yandex.ru/2.0/?load=package.full&lang=ru-RU" type="text/javascript"></script>
    <div id="map" style="width:400px; height:300px"></div>
    <input type="button" id="destroyButton" value="Редактировать линию"/>

</html>

JavaScript

var myMap;
ymaps.ready(init);

function init () {
    myMap = new ymaps.Map('map', {
        center:[55.76, 37.64], 
        zoom:10
    });
    	myPolyline = [];
        var    coords = [
            [[55.85, 37.50],
            [55.85, 37.40],
            [55.75, 37.50],
            [55.75, 37.40]
            ],[
            [55.80, 37.50],
            [55.80, 37.40],
            [55.70, 37.50],
            [55.70, 37.40]
            ]];
    for(var i=0; i< coords.length; i++){
           add_line(coords[i]);
    }
    $("#destroyButton").click(
                function(){
                    for(var i=0; i<myPolyline.length; i++){
                        myPolyline[i].editor.startEditing();
                    }
                });
    function add_line(coords){
         var a =  new ymaps.Polyline(coords, {}, {
                strokeColor: "#0066ff",
                strokeWidth: 4,
                editorMaxPoints: 500,
                editorMenuManager: function (items) {
                    items.push({
                        title: "Удалить линию",
                        onClick: function () {
                            myMap.geoObjects.remove(a);
                        }
                    });
                    return items;
                }
            });
            myPolyline.push(a);
           myMap.geoObjects.add(myPolyline[myPolyline.length-1]);    
    }
}