Какая-то мистика творится. Пытаюсь скрывать и показывать группу меток, но при указании у двух меток подсказки (hint) скрытие группы перестаёт работать нормально.
В листинге ниже раскомментить две строки:
//две чудодейственных метки
//marker0.hint = 'marker0';
//marker1.hint = 'marker1';
//---------------------------
В чём может быть проблема?
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Примеры YMapsML. Отображение простого объекта на карте.</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251"/>
<script src="http://api-maps.yandex.ru
<script type="text/javascript">
var groupOne;
var groupTwo;
var marker0;
var myMap;
window.onload = function () {
ymaps.ready(function () {
myMap = new ymaps.Map("map", {
center: [55.76, 37.64],
zoom: 10
});
var myGeoObject = new ymaps.Placemark([55.8, 37.6], {
balloonContent: 'Спецмаркер, с довольно длинным описанием'
});
myMap.geoObjects.add(myGeoObject); // Размещение геообъекта на карте.
marker0 = new ymaps.Placemark([55.7, 37.4]);
var marker1 = new ymaps.Placemark([55.68, 37.3]);
var marker2 = new ymaps.Placemark([55.85, 37.5]);
var marker3 = new ymaps.Placemark([55.7, 37.6]);
var marker4 = new ymaps.Placemark([55.8, 37.7]);
//две чудодейственных метки
//marker0.hint = 'marker0';
//marker1.hint = 'marker1';
//---------------------------
marker2.hint = 'marker2';
marker3.hint = 'marker3';
marker4.hint = 'marker4';
marker0.events.add('click', function (e) { onClick(e); });
marker1.events.add('click', function (e) { onClick(e); });
marker2.events.add('click', function (e) { onClick(e); });
marker3.events.add('click', function (e) { onClick(e); });
marker4.events.add('click', function (e) { onClick(e); });
groupOne = new ymaps.GeoObjectCollection({}, { });
groupOne.add(marker0);
groupOne.add(marker1);
groupOne.add(marker2);
groupTwo = new ymaps.GeoObjectCollection({}, {});
groupTwo.add(marker3);
groupTwo.add(marker4);
myMap.geoObjects.add(groupOne);
myMap.geoObjects.add(groupTwo);
myMap.behaviors.enable('scrollZoom');
myMap.behaviors.disable('dblClickZoom');
});
}
</script>
</head>
<body>
<table>
<tr>
<td colspan="3">
<div id="map" style="width:600px;height:400px"></div>
</td>
</tr>
<tr>
<td><input type="button" value="ShowGroup" onclick="show()" /></td>
<td><input type="button" value="HideGroup" onclick="hide()" /></td>
<td><input type="button" value="WhereError" onclick="showError()" /></td>
</tr>
<tr>
<td colspan="3"><textarea id="txt"></textarea></td>
</tr>
<tr>
<td colspan="3"><a href="http://api.yandex.ru/maps
</tr>
</table>
<script type="text/javascript">
function show() {
myMap.geoObjects.add(groupOne);
}
function hide() {
myMap.geoObjects.remove(groupOne);
}
function showError() {
marker0.options.set({
iconLayout: 'default#image',
iconImageHref: 'http://www.veryicon.com/i
iconImageSize: [42, 42],
iconImageOffset: [-3, -42]
});
var text = document.getElementById("txt");
text.value = 'Success.';
}
function onClick(e) {
var text = document.getElementById("txt");
text.value = e.get('target').hint;
}
</script>
</body>
</html>