Клуб API Карт

Не работает поиск

Kommunark
10 апреля 2012, 03:01

Кто подскажет почему не работает и как исправить?

При вводе в строку поиска и нажатии enter или кнопки никакой реакции.

 Карта на сайте 

 


   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Карта г. Гатчина.</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://api-maps.yandex.ru/1.1/?key=ANGTKUwBAAAAsvP2YAIAtWeQRkaWRpKdwT7LK3PLjHgpaswAAAAAAAAAAABg4Z1EuRXnSR1L8utx8yyo06czxw==&modules=traffic~pmap&wizard=constructor" type="text/javascript"></script>
<script type="text/javascript">
// Создание обработчика для события window.onLoad
YMaps.jQuery(function () {
// Создание экземпляра карты и его привязка к созданному контейнеру
var map = new YMaps.Map(YMaps.jQuery("#YMapsID-201")[0]

// Установка для карты ее центра и масштаба
map.setCenter(new YMaps.GeoPoint(30.138343,59.575094), 12);

// Добавление элементов управления
map.enableScrollZoom(
map.addControl(new YMaps.ToolBar()
map.addControl(new YMaps.TypeControl()
map.addControl(new YMaps.Zoom()

// Группы объектов
var groups = [
createGroup("Магазины продуктовые", [
createPlacemark(new YMaps.GeoPoint(30.126952,59.561778), "Монумент \"Родина-Мать\""),
createPlacemark(new YMaps.GeoPoint(30.516489,50.45351), "Памятник \"Богдану Хмельницкому\""),
createPlacemark(new YMaps.GeoPoint(30.529874,50.454433), "Арка Дружбы народов")
], "default#redPoint"),
createGroup("Кафе", [
createPlacemark(new YMaps.GeoPoint(30.60791,50.50955), "Ресторан \"Калинка-Малинка\"", "пр.Владимира Маяковского, 47"),
createPlacemark(new YMaps.GeoPoint(30.521708,50.429083), "Бар \"Сало-бар\"", "ул. Анри Барбюса, 5а"),
createPlacemark(new YMaps.GeoPoint(30.498271,50.450843), "Абсент-бар \"Палата №6\"", "бульвар Воровского, 31а"),
createPlacemark(new YMaps.GeoPoint(30.516498,50.454834), "Ресторан \"Спотыкач\"", "Владимирская,16")
], "default#greenPoint"),
createGroup("Банкоматы", [
createPlacemark(new YMaps.GeoPoint(30.520163,50.443334), "Музей грамзаписи и старинных музыкальных инструментов"),
createPlacemark(new YMaps.GeoPoint(30.505269,50.446977), "Музей истории медицины или Анатомический театр"),
createPlacemark(new YMaps.GeoPoint(30.530889,50.452512), "Музей воды. Водно-информационный центр")
], "default#orangePoint"),
createGroup("Вокзалы", [
createPlacemark(new YMaps.GeoPoint(30.516174,50.45987), "Замок Ричарда-Львиное сердце"),
createPlacemark(new YMaps.GeoPoint(30.528598,50.445049), "\"Дом с химерами\""),
createPlacemark(new YMaps.GeoPoint(30.511809,50.449156), "Дом Рыцаря")
])
];

// Создание списка групп
for (var i = 0; i < groups.length; i++) {
addMenuItem(groups[i], map, YMaps.jQuery("#menu")
}
})

// Добавление одного пункта в список
function addMenuItem (group, map, menuContainer) {

// Показать/скрыть группу на карте
YMaps.jQuery("<a class=\"title\" href=\"#\">" + group.title + "</a>")
.bind("click", function () {
var link = YMaps.jQuery(this);

// Если пункт меню "неактивный", то добавляем группу на карту,
// иначе - удаляем с карты
if (link.hasClass("active")) {
map.removeOverlay(group);
} else {
map.addOverlay(group);
}

// Меняем "активность" пункта меню
link.toggleClass("active");

return false;
})

// Добавление нового пункта меню в список
.appendTo(
YMaps.jQuery("<li></li>").appendTo(menuContainer)
)
};

// Создание группы
function createGroup (title, objects, style) {
var group = new YMaps.GeoObjectCollection(style);

group.title = title;
group.add(objects);

return group;
};

// Создание метки
function createPlacemark (point, name, description) {
var placemark = new YMaps.Placemark(point);

placemark.name = name;
placemark.description = description;

return placemark
}





// Функция для отображения результата геокодирования
// Параметр value - адрес объекта для поиска
function showAddress (value) {
// Удаление предыдущего результата поиска
map.removeOverlay(geoResult);

// Запуск процесса геокодирования
var geocoder = new YMaps.Geocoder(value, {results: 1, boundedBy: map.getBounds()}

// Создание обработчика для успешного завершения геокодирования
YMaps.Events.observe(geocoder, geocoder.Events.Load, function () {
// Если объект был найден, то добавляем его на карту
// и центрируем карту по области обзора найденного объекта
if (this.length()) {
geoResult = this.get(0);
map.addOverlay(geoResult);
map.setBounds(geoResult.getBounds()
}else {
alert("Ничего не найдено")
}
}

// Процесс геокодирования завершен неудачно
YMaps.Events.observe(geocoder, geocoder.Events.Fault, function (geocoder, error) {
alert("Произошла ошибка: " + error);
})
}

</script>

<style type="text/css">
/* Оформление меню (начало)*/

#menu {
list-style: none;

margin: 0;
padding: 0;
}

#menu a {
text-decoration: none;

border-bottom: dashed 1px;
}

a.active {
color: #000;
}

/* Оформление меню (конец)*/







/* Общие объявления (начало) */
body {
font-family: Verdana;
font-size: 0.8em;

margin: 0;
padding: 0;
}

html, body, .l-search{
width: 100%;
}

/* Общие объявления (конец) */


/* Карта (начало) */

.b-map .map {
width: 80%;
height: 400px;
}

/* Карта (конец) */


/* Помощь (начало) */

.b-help {
text-align: justify;
}

/* Помощь (конец) */

/* Контентная часть страницы (конец) */
</style>



<body>
<form action="#" onsubmit="showAddress(this.address.value);return false;">
<p>
<input type="text" id="address" style="width:525px;" value="Гатчина" />
<input type="submit" value="Искать" />
</p>

<table>
<tr>
<td valign="top"><ul id="menu"></ul></td>
<td><div id="YMapsID-201" style="width:500px;height:400px"></div></td>

</tr>
</table>

</form>
</body>
</html>

 

 

 

4 комментария
Подписаться на комментарии к посту

Подскажет, например, firebug,

что у вас переменная map не видна там где вы к ней обращаетесь

А  как сделать переменную map видимой?

вынести ее обЪявление из обработчика 

Спасибо, вроде получилось.