Клуб API Карт

Как отобразить одну конкретную метку?

spamarmy
18 ноября 2014, 18:34

Добрый день. 

Есть карта.

На ней 100 меток.

У каждой метки есть тип и ид.

Обычно отображается все сразу.

Но иногда нужно отображать только метки одного типа или только метки другого типа.

Это можно решить через коллекции как я понял.

Но иногда нужно скрыть все метки кроме одной. Как это сделать?

Нашел тут свойство visible - оно подходит.

Но как в метку передать уникальный id чтобы потом по нему найти из программы - не понял.

И еще - а через jquery будет работать как нить так или надо обязательно пользоватся api yandex.map

$('ymaps').hide();

 $('ymaps #uid').show(); 

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

Для идентификации меток удобно использовать поле properties (второй параметр в конструкторе Метки)

 

var myPlacemark = new ymaps.Placemark([_lat_, _lng_], { id: '1' });

 

Искать нужную метку можно с помощью geoQuery

ymaps.geoQuery(myMap.geoObjects).search('properties.id = "1"')

  .setOptions('visible', false);

Спасибо.

Реализовал.

Получилось. Вот такой код:

$(".js_show_on_map").click(function () {
var e = $(this);
var id = e.data("object_id");

clinics.options.set('visible', false);
drugstore.options.set('visible', false);
ymaps.geoQuery(myMap.geoObjects).search("properties.object_id = '" + id + "'").setOptions('visible', true);
$("#js_mapping").show();
});

 

 clinics и drugstore - это коллекции 

 

 

Но выявилась другая проблема.

Когда я жму на один объект  ".js_show_on_map"

карта очищается и объект отображается.

Но когда я жму на другой объект   ".js_show_on_map" - с другим id

то оотображены оба оъекта и первый и второй.

Помогите.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

А как оно должно работать?

Что такое clinics и dragstore?

Приложение будет работать так:

Есть два экрана.
Список и карта

На списке есть клиники и аптеки.

Соответсвенно на карте по умолчанию отображается все объекты - клиники и аптеки. (И карта по умолчанию скрыта)

Когда человек в списке жмет на значок с клиникой ему надо отобразить эту конкретную клинику на карте - остальные скрыть

Также на экране списка есть кнопки: карта - отобразить всё, клиники - отобразить только клиники, и аптеки - отобразить только аптеки

Вот такой сейчас код получается:






script type="text/javascript">
var myMap;
var clinics;
var drugstore;
ymaps.ready(function () {
myMap = new ymaps.Map('js_mapping', {
center: [55.76, 37.64],
zoom: 13
});

clinics = new ymaps.GeoObjectCollection({}, {
preset: 'islands#darkBlueIcon'
});

myPlacemark = new ymaps.Placemark(
[55.766759, 37.670959],
{
balloonContentBody: 'Клиника: body: Живи Вечно',
hintContent: "Клиника:hint: Живи Вечно",
object_id: "clinic_3"
}
);
clinics.add(myPlacemark);
myPlacemark = new ymaps.Placemark(
[55.766759, 37.670959],
{
balloonContentBody: 'Клиника: body: Красота Где то рядом',
hintContent: "Клиника:hint: Красота Где то рядом",
object_id: "clinic_2"
}
);
clinics.add(myPlacemark);
myMap.geoObjects.add(clinics);

drugstore = new ymaps.GeoObjectCollection({}, {
preset: 'islands#oliveIcon'
});
myPlacemark = new ymaps.Placemark(
[55.758463, 37.660287],
{
balloonContentBody: 'Аптека:body: 36.6',
hintContent: "Аптека:hint: 36.6",
object_id: "drugstore_2"
}
);
drugstore.add(myPlacemark);
myPlacemark = new ymaps.Placemark(
[55.764566, 37.645492],
{
balloonContentBody: 'Аптека:body: Аптека "Асклепий"',
hintContent: "Аптека:hint: Аптека "Асклепий"",
object_id: "drugstore_1"
}
);
drugstore.add(myPlacemark);
drugstore.add(myPlacemark);
myMap.geoObjects.add(drugstore);

});



и jquery функция

$(".js_show_on_map").click(function () {
var e = $(this);
var id = e.data("object_id");

clinics.options.set('visible', false);
drugstore.options.set('visible', false);
// myMap.geoObjects.options.set('visible', false);
ymaps.geoQuery(myMap.geoObjects).search("properties.object_id = '" + id + "'").setOptions('visible', true);
$(".left_column").hide();
$("#js_mapping").show();
return false;
});

вы можете хранить ссылку на выбранную метку или можно использовать geoQuery.remove

 

var geoObjects =  ymaps.geoQuery(myMap.geoObjects);

// выделим выбранный

var selected = geoObjects.search("properties.object_id = '" + id + "'").setOptions('visible', true);

// все остальные спрячем

geoObjects.remove(selected).setOptions('visible', false);