Вопрос в следующем, как прикрепить к этим меткам балуны, метки идут через FeatureCollection и я не понимаю как сделать к ним балун, пробовал от myPlacemark, но так не работает.
<script type="text/javascript">
ymaps.ready(init);
var myMap,
myPlacemark;
function init() {
var myMap = new ymaps.Map('map', {
center: [55.755826, 37.6173],
zoom: 10
});
red = new ymaps.Placemark([55.709658441942416, 37.632903415777605], {
// Чтобы балун и хинт открывались на метке, необходимо задать ей определенные свойства.
balloonContentHeader: "AFI Residence Paveletskaya",
balloonContentBody: "Cкачать презентацию",
balloonContentFooter: "Москва, Павелецкая наб., д.8 - 6 ",
hintContent: "Подробнее"
});
myMap.geoObjects.add(red);
// Функция, которая по состоянию чекбоксов в меню
// показывает или скрывает геообъекты из выборки.
function checkState () {
var shownObjects,
byColor = new ymaps.GeoQueryResult(),
byShape = new ymaps.GeoQueryResult();
// Отберем объекты по цвету.
if ($('#red').prop('checked')) {
// Будем искать по двум параметрам:
// - для точечных объектов по полю preset;
// - для контурных объектов по цвету заливки.
byColor = myObjects.search('options.fillColor = "#ff1000"')
.add(myObjects.search('options.preset = "twirl#redIcon"'));
}
if ($('#green').prop('checked')) {
byColor = myObjects.search('options.fillColor = "#00ff00"')
.add(myObjects.search('options.preset = "twirl#greenIcon"'))
// После того, как мы нашли все зеленые объекты, добавим к ним
// объекты, найденные на предыдущей итерации.
.add(byColor);
}
if ($('#yellow').prop('checked')) {
byColor = myObjects.search('options.fillColor = "#ffcc00"')
.add(myObjects.search('options.preset = "twirl#yellowIcon"'))
.add(byColor);
}
// Отберем объекты по форме.
if ($('#point').prop('checked')) {
byShape = myObjects.search('geometry.type = "Point"');
}
if ($('#polygon').prop('checked')) {
byShape = myObjects.search('geometry.type = "Polygon"').add(byShape);
}
if ($('#circle').prop('checked')) {
byShape = myObjects.search('geometry.type = "Circle"').add(byShape);
}
// Мы отобрали объекты по цвету и по форме. Покажем на карте объекты,
// которые совмещают нужные признаки.
shownObjects = byColor.intersect(byShape).addToMap(myMap);
// Объекты, которые не попали в выборку, нужно убрать с карты.
myObjects.remove(shownObjects).removeFromMap(myMap);
}
$('#red').click(checkState);
$('#green').click(checkState);
$('#yellow').click(checkState);
$('#point').click(checkState);
$('#polygon').click(checkState);
$('#circle').click(checkState);
// Создадим объекты из их JSON-описания и добавим их на карту.
window.myObjects = ymaps.geoQuery({
type: "FeatureCollection",
features: [
{
type: 'Feature',
geometry: {
type: 'Point',
coordinates: [55.895636, 37.462314900000024]
},
options: {
preset: 'twirl#yellowIcon'
}
},
{
type: 'Feature',
geometry: {
type: 'Point',
coordinates: [55.8104533, 37.64509599999997]
},
options: {
preset: 'twirl#greenIcon'
}
},
{
type: 'Feature',
geometry: {
type: 'Point',
coordinates: [55.70864899999999, 37.64558490000002]
},
options: {
preset: 'twirl#greenIcon'
}
},
{
type: 'Feature',
geometry: {
type: 'Point',
coordinates: [55.84060729999999, 37.49379109999995],
radius: 10000
},
options: {
preset: 'twirl#redIcon'
}
}
]
}).addToMap(myMap);
}
var expanded = false;
function showCheckboxes() {
var checkboxes = document.getElementById("checkboxes");
if (!expanded) {
checkboxes.style.display = "block";
expanded = true;
} else {
checkboxes.style.display = "none";
expanded = false;
}
}
</script> <form>
<div class="multiselect">
<div class="selectBox" onclick="showCheckboxes()">
<select>
<option>Выбрать фильтр</option>
</select>
<div class="overSelect"></div>
</div>
<div id="checkboxes">
<label for="red" >
<input type="checkbox" id="red" checked=true/>Красные</label>
<label for="green">
<input type="checkbox" id="green"checked=true />Зеленые</label>
<label for="yellow">
<input type="checkbox" id="yellow"checked=true />Желтые</label>
<label for="point">
<input type="checkbox" id="point"checked=true />Все объекты</label>
</div>
</div>
</form>
