Доброго времени суток. у меня проблема, что после поиска в
балуне
результат видно только после выделения текста, пробовал различные
алгоритмы, карта интегрирована на страницу сайта, приведу весь листинг,
только ключ свой вставьте:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"
/>
<script src="http://api-maps.yandex.ru/1.1/index.xml?key=AAmMzEsBAAAAhCCPfwMBydwaGy9eGF73hEdM5Xahpouay_MAAAAAAAAAAABF_stph19S0av2kxU2pgJCVcE6Xw== "
type="text/javascript"></script>
<script
type="text/javascript">
// Создание обработчика для
события window.onLoad
YMaps.jQuery(function () {
// Создание экземпляра карты и его привязка к созданному контейнеру
var map = new YMaps.Map(YMaps.jQuery("#YMapsID")[0]),
// Результат поиска
geoResult;
// Установка для карты ее центра и масштаба
map.setCenter(new YMaps.GeoPoint(58.772143,57.280394), 12,
YMaps.MapType.HYBRID);
// Поиск по нажатию
Enter в поисковом поле
YMaps.jQuery("#request").bind("keyup", function (e) {
if (e.keyCode == 13) {
search();
}
});
// Поиск по щелчку на кнопке
"Искать"
YMaps.jQuery("#search").bind("click", search);
function search () {
// Запускаем поиск
var geocoder = new YMaps.Geocoder(YMaps.jQue
результат видно только после выделения текста, пробовал различные
алгоритмы, карта интегрирована на страницу сайта, приведу весь листинг,
только ключ свой вставьте:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"
/>
<script src="http://api-maps.yandex.ru
type="text/javascript"></script>
<script
type="text/javascript">
// Создание обработчика для
события window.onLoad
YMaps.jQuery(function () {
// Создание экземпляра карты и его привязка к созданному контейнеру
var map = new YMaps.Map(YMaps.jQuery("#YMapsID")[0]),
// Результат поиска
geoResult;
// Установка для карты ее центра и масштаба
map.setCenter(new YMaps.GeoPoint(58.772143,57.280394), 12,
YMaps.MapType.HYBRID);
// Поиск по нажатию
Enter в поисковом поле
YMaps.jQuery("#request").bind("keyup", function (e) {
if (e.keyCode == 13) {
search();
}
});
// Поиск по щелчку на кнопке
"Искать"
YMaps.jQuery("#search").bind("click", search);
function search () {
// Запускаем поиск
var geocoder = new YMaps.Geocoder(YMaps.jQue
ry("#request").attr("value"),
{
prefLang : YMaps.jQuery("#lang").val()
} );
var listenerLoad =
YMaps.Events.observe(geocoder, geocoder.Events.Load, function (geocoder)
{
// Если результа геокодирования был добавлен
на карту, то удалим его
if (geoResult) {
map.removeOverlay(geoResult);
}
if (geocoder.length()) {
// Отображаем первый релевантный результат геокодирования
geoResult = geocoder.get(1);
geoResult.openBalloon();
map.addOverlay(geoResult);
// Центрируем
карту по найденному объекту
map.setBounds(geoResult.getBounds());
} else {
alert("По вашему запросу ничего не найдено.");
}
listenerLoad.cleanup();
});
};
// Создание элемента управления " ? "
var
informationControl = new InformationControl();
// Создание новой кнопки
// Добавляем ее к стандартной
группе кнопок на панеле инструментов
var
buttonInformation = new YMaps.ToolBarRadioButton(YMaps.ToolBar.DEFAULT_GROUP,
{
caption: " ? "
});
// Включение/выключение инструмента " ? "
YMaps.Events.observe(buttonInformation, buttonInformation.Events.Select,
function () {
map.addControl(informationControl);
});
YMaps.Events.observe(buttonInformation,
buttonInformation.Events.Deselect, function () {
map.removeControl(informationControl);
});
// Добавление элементов управления на карту
var toolBar =
new YMaps.ToolBar([new YMaps.ToolBar.MoveButton(), new
YMaps.ToolBar.RulerButton()]);
toolBar.add(buttonInformation);
map.addControl(toolBar);
map.addControl(new YMaps.Zoom());
map.enableScrollZoom();
});
// Элемент
управления " ? "
function InformationControl () {
var geoResult, clickPlace, listener, map;
//
Вызывается при добавлении элемента управления на карту
this.onAddToMap = function (parentMap) {
map =
parentMap;
map.addCursor(YMaps.Cursor.HELP);
// Создание обработчика кликов по карте
listener =
YMaps.Events.observe(map, map.Events.Click, function (map, mEvent) {
// Координаты клика мышью
var clickPoint =
mEvent.getGeoPoint();
// Удаляем предыдущие
результаты (если они были добавлены на карту)
if
(geoResult) {
map.removeOverlay(geoResult);
result = null;
}
if
(clickPlace) {
map.removeOverlay(clickPlace);
clickPlace = null;
}
// Отмечаем точку по которой щелкнул пользователь
clickPlace = new YMaps.Placemark(clickPoint, {style: anchorStyle});
clickPlace.description = clickPoint.toString();
map.addOverlay(clickPlace);
// Запуск
процесса геокодирования
this.geocode(clickPoint);
}, this);
}
// Геокодирует точку
this.geocode = function (clickPoint) {
// Выключаем
обработчиков событий, чтобы к геокодеру ушло не более одного запроса
// (по окончанию геокодированияю включаем обработчик вновь)
listener.disable();
// Запуск процесса
геокодирования
var geocoder = new
YMaps.Geocoder(clickPoint);
// Обработчик
успешного завершения геокодирования
YMaps.Events.observe(geocoder, geocoder.Events.Load, function (geocoder)
{
// Получение результата поиска
geoResult = this.getResult(geocoder);
if
(geoResult) {
geoResult.setStyle(markStyle);
// Задаем содержимое балуна
var sep = ', ',
names = (geoResult.text || '').split(sep),
index = geoResult.kind === 'house' ? -2 : -1;
geoResult.setBalloonContent("<b>" + names.slice(index).join(sep) +
"</b><div>" + names.slice(0, index).join(sep) +
"</div>");
// Открываем балун
map.addOverlay(geoResult);
geoResult.openBalloon();
} else {
alert("Ничего не найдено!");
}
// Включаем обработчик кликов по карте
listener.enable();
}, this);
// Обработчик неудачного геокодирования
YMaps.Events.observe(geocoder, geocoder.Events.Fault, function
(geocoder, err) {
alert("Произошла ошибка при
геокодировании: " + err);
// Включаем
обработчик кликов по карте
listener.enable();
});
}
// Возвращает результат
различной точности в зависимости от масштаба
this.getResult = function (geocoder) {
// Точность:
город, страна
function isOther (result) {
return result.precision == "other";
}
// Точность: улица
function isStreet (result) {
return result.precision == "street";
}
// Точность: дом
function isHouse (result) {
return !isOther(result) && !isStreet(result);
};
// Выбор точности поиска
var filter = isHouse;
if (map.getZoom() < 10) {
filter = isOther;
} else if (map.getZoom() < 15) {
filter = isStreet;
}
//
Возвращает первый найденный результат с нужной точностью
return geocoder.filter(filter)[0];
}
// Вызывается при удалении элемента управления с карты
this.onRemoveFromMap = function () {
map.removeCursor(YMaps.Cursor.HELP);
// Удаляем
метки с карты, если они были добавлены
if (geoResult)
{
map.removeOverlay(geoResult);
}
if (clickPlace) {
map.removeOverlay(clickPlace);
}
// Удаляем обработчик кликов по карте
listener.cleanup();
map = geoResult = clickPlace =
listener = null;
}
// Создадим стили
для значков
var anchorStyle = new YMaps.Style();
anchorStyle.iconStyle = new YMaps.IconStyle();
anchorStyle.iconStyle.href = "http://maps.yandex.ru/css/b-location-balloon/b-location-balloon.anchor.png ";
anchorStyle.iconStyle.size = new YMaps.Point(18, 18);
anchorStyle.iconStyle.offset = new YMaps.Point(-9, -18);
var markStyle = new YMaps.Style();
markStyle.iconStyle =
new YMaps.IconStyle();
markStyle.iconStyle.href = "http://maps.yandex.ru/css/b-location-balloon/b-location-balloon.mark.png ";
markStyle.iconStyle.size = new YMaps.Point(21, 19);
markStyle.iconStyle.offset = new YMaps.Point(-1, -18);
}
</script>
<style type="text/css">
body {
margin : 0;
padding : 20px;
}
.b-search-panel {
border-collapse :
collapse;
}
.b-search-panel td {
padding : 0;
}
.b-search-input {
width : 400px;
padding : 3px;
margin-right : 10px;
}
.b-search-button {
padding : 2px 4px;
}
.b-search-lang {
padding : 3px;
margin-right : 10px;
}
.b-map {
width : 700px;
height : 650px;
margin-top: 10px;
}
</style>
</head>
<body>
<table
class="b-search-panel">
<tr>
<td><input id="request" class="b-search-input" type="text"
value="Шаля, Свердловская"/></td>
<td><input id="search" class="b-search-button" type="button"
value="Искать"/></td>
<td>
<select id="lang" class="b-search-lang">
<option value="ru">ru</option>
<option value="uk" selected="selected">uk</option>
<option value="be">be</option>
</select>
</td>
</tr>
<tr>
<td colspan="3"><div id="YMapsID"
class="b-map"></div></td>
</tr>
</table>
</body>
</html>
{
prefLang : YMaps.jQuery("#lang").val()
} );
var listenerLoad =
YMaps.Events.observe(geocoder, geocoder.Events.Load, function (geocoder)
{
// Если результа геокодирования был добавлен
на карту, то удалим его
if (geoResult) {
map.removeOverlay(geoResult);
}
if (geocoder.length()) {
// Отображаем первый релевантный результат геокодирования
geoResult = geocoder.get(1);
geoResult.openBalloon();
map.addOverlay(geoResult);
// Центрируем
карту по найденному объекту
map.setBounds(geoResult.getBounds());
} else {
alert("По вашему запросу ничего не найдено.");
}
listenerLoad.cleanup();
});
};
// Создание элемента управления " ? "
var
informationControl = new InformationControl();
// Создание новой кнопки
// Добавляем ее к стандартной
группе кнопок на панеле инструментов
var
buttonInformation = new YMaps.ToolBarRadioButton(
{
caption: " ? "
});
// Включение/выключение инструмента " ? "
YMaps.Events.observe(buttonInformation, buttonInformation.Events.Select,
function () {
map.addControl(informationControl);
});
YMaps.Events.observe(buttonInformation,
buttonInformation.Events.Deselect, function () {
map.removeControl(informationControl);
});
// Добавление элементов управления на карту
var toolBar =
new YMaps.ToolBar([new YMaps.ToolBar.MoveButton(), new
YMaps.ToolBar.RulerButton()]);
toolBar.add(buttonInformation);
map.addControl(toolBar);
map.addControl(new YMaps.Zoom());
map.enableScrollZoom();
});
// Элемент
управления " ? "
function InformationControl () {
var geoResult, clickPlace, listener, map;
//
Вызывается при добавлении элемента управления на карту
this.onAddToMap = function (parentMap) {
map =
parentMap;
map.addCursor(YMaps.Cursor.HELP);
// Создание обработчика кликов по карте
listener =
YMaps.Events.observe(map, map.Events.Click, function (map, mEvent) {
// Координаты клика мышью
var clickPoint =
mEvent.getGeoPoint();
// Удаляем предыдущие
результаты (если они были добавлены на карту)
if
(geoResult) {
map.removeOverlay(geoResult);
result = null;
}
if
(clickPlace) {
map.removeOverlay(clickPlace);
clickPlace = null;
}
// Отмечаем точку по которой щелкнул пользователь
clickPlace = new YMaps.Placemark(clickPoint, {style: anchorStyle});
clickPlace.description = clickPoint.toString();
map.addOverlay(clickPlace);
// Запуск
процесса геокодирования
this.geocode(clickPoint);
}, this);
}
// Геокодирует точку
this.geocode = function (clickPoint) {
// Выключаем
обработчиков событий, чтобы к геокодеру ушло не более одного запроса
// (по окончанию геокодированияю включаем обработчик вновь)
listener.disable();
// Запуск процесса
геокодирования
var geocoder = new
YMaps.Geocoder(clickPoint);
// Обработчик
успешного завершения геокодирования
YMaps.Events.observe(geocoder, geocoder.Events.Load, function (geocoder)
{
// Получение результата поиска
geoResult = this.getResult(geocoder);
if
(geoResult) {
geoResult.setStyle(markStyle);
// Задаем содержимое балуна
var sep = ', ',
names = (geoResult.text || '').split(sep),
index = geoResult.kind === 'house' ? -2 : -1;
geoResult.setBalloonContent("<b>" + names.slice(index).join(sep) +
"</b><div>" + names.slice(0, index).join(sep) +
"</div>");
// Открываем балун
map.addOverlay(geoResult);
geoResult.openBalloon();
} else {
alert("Ничего не найдено!");
}
// Включаем обработчик кликов по карте
listener.enable();
}, this);
// Обработчик неудачного геокодирования
YMaps.Events.observe(geocoder, geocoder.Events.Fault, function
(geocoder, err) {
alert("Произошла ошибка при
геокодировании: " + err);
// Включаем
обработчик кликов по карте
listener.enable();
});
}
// Возвращает результат
различной точности в зависимости от масштаба
this.getResult = function (geocoder) {
// Точность:
город, страна
function isOther (result) {
return result.precision == "other";
}
// Точность: улица
function isStreet (result) {
return result.precision == "street";
}
// Точность: дом
function isHouse (result) {
return !isOther(result) && !isStreet(result);
};
// Выбор точности поиска
var filter = isHouse;
if (map.getZoom() < 10) {
filter = isOther;
} else if (map.getZoom() < 15) {
filter = isStreet;
}
//
Возвращает первый найденный результат с нужной точностью
return geocoder.filter(filter)[0];
}
// Вызывается при удалении элемента управления с карты
this.onRemoveFromMap = function () {
map.removeCursor(YMaps.Cursor.HELP);
// Удаляем
метки с карты, если они были добавлены
if (geoResult)
{
map.removeOverlay(geoResult);
}
if (clickPlace) {
map.removeOverlay(clickPlace);
}
// Удаляем обработчик кликов по карте
listener.cleanup();
map = geoResult = clickPlace =
listener = null;
}
// Создадим стили
для значков
var anchorStyle = new YMaps.Style();
anchorStyle.iconStyle = new YMaps.IconStyle();
anchorStyle.iconStyle.href = "http://maps.yandex.ru/css
anchorStyle.iconStyle.size = new YMaps.Point(18, 18);
anchorStyle.iconStyle.offset = new YMaps.Point(-9, -18);
var markStyle = new YMaps.Style();
markStyle.iconStyle =
new YMaps.IconStyle();
markStyle.iconStyle.href = "http://maps.yandex.ru/css
markStyle.iconStyle.size = new YMaps.Point(21, 19);
markStyle.iconStyle.offset = new YMaps.Point(-1, -18);
}
</script>
<style type="text/css">
body {
margin : 0;
padding : 20px;
}
.b-search-panel {
border-collapse :
collapse;
}
.b-search-panel td {
padding : 0;
}
.b-search-input {
width : 400px;
padding : 3px;
margin-right : 10px;
}
.b-search-button {
padding : 2px 4px;
}
.b-search-lang {
padding : 3px;
margin-right : 10px;
}
.b-map {
width : 700px;
height : 650px;
margin-top: 10px;
}
</style>
</head>
<body>
<table
class="b-search-panel">
<tr>
<td><input id="request" class="b-search-input" type="text"
value="Шаля, Свердловская"/></td>
<td><input id="search" class="b-search-button" type="button"
value="Искать"/></td>
<td>
<select id="lang" class="b-search-lang">
<option value="ru">ru</option>
<option value="uk" selected="selected">uk</option>
<option value="be">be</option>
</select>
</td>
</tr>
<tr>
<td colspan="3"><div id="YMapsID"
class="b-map"></div></td>
</tr>
</table>
</body>
</html>
| ||