Всем привет! В программировании я не очень, поэтому с трудом пополам написал такой код для создания метки на карте и передачи ее координат, адреса и масштаба в поле "input". И затормозил на нескольких задачах. Поэтому решил обратиться за помощью к гуру. Собственно, код:
ymaps.ready(init);
function init() {
var myMap = new ymaps.Map("map", {
center: [59.93840592010904,30.316897968261596],
zoom: 12,
controls: ['zoomControl', 'fullscreenControl', 'geolocationControl',
new ymaps.control.SearchControl({
options: {
size: 'large',
provider: 'yandex#search'
}
})]
});
/* Начальный адрес метки */
var address = '59.93840592010904,30.316897968261596';
ymaps.geocode(address).then(function(res) {
var coord = res.geoObjects.get(0).geometry.getCoordinates();
var myPlacemark = new ymaps.Placemark(coord, null, {
preset: 'islands#blueDotIcon',
draggable: true
});
myMap.events.add('click', function (e) {
var coords = e.get('coords');
// Если метка уже создана – просто передвигаем ее.
if (myPlacemark) {
myPlacemark.geometry.setCoordinates(coords);
}
// Если нет – создаем.
else {
myPlacemark = createPlacemark(coords);
myMap.geoObjects.add(myPlacemark);
// Слушаем событие окончания перетаскивания на метке.
myPlacemark.events.add('dragend', function () {
getAddress(myPlacemark.geometry.getCoordinates());
});
}
getAddress(coords);
});
/* Событие dragend - получение нового адреса */
myPlacemark.events.add('dragend', function(e){
var coords = e.get('target').geometry.getCoordinates();
var new_coords = [coords[0].toFixed(4), coords[1].toFixed(4)];
$('#bpxl_infocoords').val(new_coords);
ymaps.geocode(new_coords).then(function(res) {
var data = res.geoObjects.get(0).properties.getAll();
$('#bpxl_infoadress').val(data.text);
});
var zoom = myMap.getZoom()
$('#bpxl_infoscale').val(zoom);
});
myMap.geoObjects.add(myPlacemark);
myMap.setCenter(coord, 12);
});
myMap.behaviors.disable('scrollZoom');
if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)){
myMap.behaviors.disable('drag');
}
}
<!DOCTYPE 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="event_reverse_geocode.js" type="text/javascript"></script>
<script src="https://yandex.st/jquery/2.1.1/jquery.min.js"></script>
<style type="text/css">
html, body {
width: 100%;
height: 95%;
margin: 0;
padding: 0;
font-family: Arial;
font-size: 14px;
}
#map {
width: 100%;
height: 95%;
}
.header {
padding: 5px;
}
</style>
</head>
<body>
<p class="header">Кликните по карте, чтобы узнать адрес</p>
<div id="map"></div>
Адрес: <input type="text" id="bpxl_infoadress">
Координаты: <input type="text" id="bpxl_infocoords">
Масштаб: <input type="text" id="bpxl_infoscale">
</body>
</html>
Проверяю работоспособность этого кода здесь -
https://yandex.ru/dev/maps/jsbox/2.1/event_reverse..., заменив родной код, моим.
Собственно, сами, проблемы:
1. При перемещении курсора кликом на карту, адрес и координаты не обновляются.
2. При изменении масштаба, коэффициент масштаба в input не меняется, только после перемещения метки.
3. Как удалить из адреса префикс "Россия, Санкт-Петербург" и оставить только улицу и дом?
Заранее спасибо!