JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://api-maps.yandex.ru/2.0/?load=package.full&lang=ru-RU"></script>
<script src="http://code.jquery.com/jquery-1.9.0.js"></script>
<div id="ms" style="width:400px;height:300px;display:block;"></div>
JavaScript
ymaps.ready(init);
function init () {
var zoom_val = 12;
if(!coords_new) var coords_new = [[]];
searchMap = new ymaps.Map('ms', {
center: [51.53244,46.02038],
zoom: zoom_val
});
searchMap.events.add('mousemove', function (event) {
var pos = event.get('coordPosition');
searchMap.hint.show(pos, 'Поставьте первую точку');
});
// Создаем многоугольник
myPolygon = new ymaps.Polygon(coords_new,
{},
{
strokeWidth: 6,
strokeColor: '#0e6c9b',
draggable: true
}
);
searchMap.geoObjects.add(myPolygon);
searchMap.controls
.add('zoomControl')
.add('miniMap')
.add('typeSelector')
.add('mapTools');
myPolygon.editor.startDrawing();
myPolygon.editor.startEditing();
var chnum = 0;
//var hint = searchMap.hint.show(pos, 'Поставьте точку');
myPolygon.geometry.events.add('change', function (e) {
chnum++;
searchMap.events.add('mousemove', function (event) {
var pos = event.get('coordPosition');
searchMap.hint.show(pos, 'Поставьте точку');
});
if(chnum==1){
searchMap.hint.move(pos, 'Поставьте вторую точку');
}
if(chnum==2){
searchMap.hint.show(pos, 'Поставьте третью точку');
}
if(chnum==3){
searchMap.hint.show(pos, 'Поставьте четвёртую точку или кликните по первой точке и выберите "Завершить"');
}
});
}