Есть веб-страница. По окончании ее загрузки отображается яндекс.карта в <div id="YMapsID">, координаты (широта и долгота) центра карты вводятся в скрытые поля формы. Затем пользователь должен ввести в текстовое поле с именем (name) и id="problem_address" адрес, который надо геокодировать (преобразовать в координаты) и отобразить на карте в виде перемещаемой метки (Placemark), а также записать широту и долготу в соответствующие скрытые поля формы. Я написал следующий код, но он почему-то выполняется не полностью (отображается карта, координаты центра карты записываются в скрытые поля формы, но по нажатию на кнопку на карте не появляется метка). Почему? Заранее прошу прощения за "простыню" кода!
<html>
<head>
<script src="http://api-maps.yandex.ru/2.0-stable/?load=package.full&lang=ru-RU " type="text/javascript"></script>
<script type="text/javascript">
var myMap;
function init() {
var myMap = new ymaps.Map("YMapsID", {
center: [ymaps.geolocation.latitude, ymaps.geolocation.longitude],
zoom: 12,
behaviors: ["default", "scrollZoom"]
});
myMap.controls
// Кнопка изменения масштаба
.add('zoomControl')
// Список типов карты
.add('typeSelector')
// Стандартный набор кнопок
.add('mapTools')
// Линейка масштаба
.add('scaleLine')
//Передача начальных координат точки в соответствующие поля формы:
var lat = document.getElementById('latitude');
lat.setAttribute('value', ymaps.geolocation.latitude);
var lon = document.getElementById('longitude');
lon.setAttribute('value', ymaps.geolocation.longitude);
}
ymaps.ready(init);
function showPoint() {
var addr = document.getElementById('problem_address').getAttribute('value');
// Поиск координат адреса из переменной addr:
ymaps.geocode(addr, {
results: 1
}).then(function (res) {
// Выбираем первый результат геокодирования.
var firstGeoObject = res.geoObjects.get(0);
myMap.container.fitToViewport();
attachReverseGeocode(myMap);
var myPlacemark2 = new ymaps.Placemark(firstGeoObject.geometry.getCoordinates(), {}, {
draggable: true, // метку можно перемещать,
preset: "twirl#violetStretchyIcon"
});
myMap.geoObjects.add(myPlacemark2);
}, function (err) {
// Если геокодирование не удалось, сообщаем об ошибке.
alert(err.message);
});
//если вместо ymaps.geocode(......).then(function (res){.....}, function (err){.....}) вставить
//ymaps.geoQuery(ymaps.geocode(addr)).addToMap(myMap);
//то метка тоже не появится :(
}
</script>
</head>
<body>
<form action="index.php" method="post" name="ZayavkaForm">
<input type="hidden" id="latitude" name="problem_latitude" value="">
<input type="hidden" id="longitude" name="problem_longitude" value="">Введите примерный адрес проблемы *:
<br>
<input type="text" id="problem_address" name="problem_address" value="Москва, ул. Тверская, 13" size="50" maxlength="100">
<input type="button" name="addr2map" value="Отметить на карте" onclick="showPoint()">
<br>
<div id="YMapsID" style="width: 535px; height: 330px;"></div>
<input type="submit" name="submit" value="Отправить">
</form>
</body>
</html>