Сделал карту, объекты на которой отображаются после выбора в radiobutton и checkbox (не доделал).
Необходимо еще доделать фильтрацию по выбору checkbox.
В IE медленно работает.
Подскажите я изобрел велосипед или проще это не сделать?
<script src="http://api-maps.yandex.ru/1.1/index.xml?key=AGXYMU " type="text/javascript"></script>sBAAAA6wVnKQMANms1Kg8VXfD SWapB5NT1DElzOIkAAAAAAAAA AABUMNIMzES0iJtTdIF5KWEmU 6z0Cw==
<script src="http://anton.shevchuk.name/wp-demo/jquery-tutorial " type="text/javascript"></script>s/jquery.js
<script type="text/javascript">
$(document).ready(function(){
var map = new YMaps.Map(YMaps.jQuery("#YMapsID")[0]);
// Установка для карты ее центра и масштаба
map.setCenter(new YMaps.GeoPoint(38.59582,53.321534), 4);
// Добавление элементов управления
map.addControl(new YMaps.TypeControl());
map.addControl(new YMaps.Zoom());
map.addControl(new YMaps.ScaleLine());
map.enableScrollZoom();
//Массивы с фильтрами
var filterCity = ["Россия", "Санкт-Петербург"];
var filterCitys = ["Ros", "SPb"];
var filterType = ["Общественные", "Административные", "Авто", "Жилье", "Медицина", "Промышленность", "Торговля"];
var filterTypes = ["Общ","Адм","Авт", "Жил", "Мед", "Про", "Тор"];
//Массив проектов:
var groups = [
createPlacemark(new YMaps.GeoPoint(30.458565,59.877583), "Театр \"Буфф\"", "г. Санкт-Петербург", "Народная ул., д. 1", "проектирование, монтаж", "Общ", "505", "teather"),
createPlacemark(new YMaps.GeoPoint(30.300929,59.932193), "Здание Главного почтамта", "г. Санкт-Петербург", "ул. Почтамтская, д. 9/12", "проектирование, монтаж", "Общ", "533", "buildings"),
createPlacemark(new YMaps.GeoPoint(29.491556,60.18209), "База отдыха", "г. Санкт-Петербург, пос. Смолячково", "Приморское шоссе, д. 679", "проектирование", "Общ", "1768", "camping"),
createPlacemark(new YMaps.GeoPoint(30.220584,59.972929), "Стадион \"Зенит\"", "г. Санкт-Петербург", "Южная дорога, д. 25", "проектирование", "Общ", "2055", "stadium"),
createPlacemark(new YMaps.GeoPoint(30.283098,59.93676), "Консульство Бразилии", "г. Санкт-Петербург", "8 линия, д. 5, литер А", "проектирование", "Адм", "1568", "buildings"),
createPlacemark(new YMaps.GeoPoint(30.353759,59.958764), "Банк \"Северная Казна\"", "г. Санкт-Петербург", "ул. Академика Лебедева, д.31", "проектирование", "Адм", "1563", "bank"),
createPlacemark(new YMaps.GeoPoint(30.41727,59.914186), "Автосалон \"Рольф\"", "г. Санкт-Петербург", "Октябрьская набережная, д. 6", "проектирование", "Авт", "1339", "car"),
createPlacemark(new YMaps.GeoPoint(30.244973,59.984503), "Автосалон \"МУЛЬТИМОТОРС\"", "г. Санкт-Петербург", "ул. Савушкина, квартал 66 Б северо - приморской части", "проектирование, монтаж", "Авт", "643", "car"),
createPlacemark(new YMaps.GeoPoint(30.222542,59.990264), "Авто-центр \"Lexus\"", "г. Санкт-Петербург", "ул.Школьная, 98", "проектирование, монтаж", "Авт", "689", "car"),
createPlacemark(new YMaps.GeoPoint(30.223297,59.989819), "Авто-центр \"TOYOTA\"", "г. Санкт-Петербург", "ул. Школьная, 96А", "проектирование, монтаж", "Авт", "398", "car"),
createPlacemark(new YMaps.GeoPoint(30.321186,60.051971), "Авто-центр \"MAZDA\"", "г. Санкт-Петербург", "ул. Хошимина, квартал 10", "проектирование, монтаж", "Авт", "1224", "car"),
createPlacemark(new YMaps.GeoPoint(30.185594, 59.837815), "Детская Больница №1", "г. Санкт-Петербург", "ул. Авангардная, д. 14", "проектирование", "Общ", "", "hospital"),
createPlacemark(new YMaps.GeoPoint(30.312140, 59.910217), "Шоферская медкомиссия", "г. Санкт-Петербург", "наб. Обводного канала, д. 147", "проектирование", "Общ", "", "hospital"),
createPlacemark(new YMaps.GeoPoint(30.273144,60.025637), "Завод \"Эскаро Кемикал АС\"", "г. Санкт-Петербург", "ул. Маршала Новикова, д.28", "проектирование", "Про", "587", "factory"),
createPlacemark(new YMaps.GeoPoint(48.472015,54.316581), "Завод \"Miller\"", "г. Ульяновск", "7-ой Инженерный проезд, д.44", "проектирование", "Про", "1980", "factory"),
createPlacemark(new YMaps.GeoPoint(30.379792,59.808025), "Завод \"Magner\"", "г. Санкт-Петербург, пос. Шушары", "Московское шосcе, участок 7", "проектирование", "Про", "1900", "factory"),
createPlacemark(new YMaps.GeoPoint(30.271716, 60.091931), "Завод \"Ниссан Мануфэкчуринг Рус\"", "г. Санкт-Петербург, пос. Парголово", "земельный участок №3", "проектирование", "Про", "", "factory"),
createPlacemark(new YMaps.GeoPoint(30.273144, 60.025637), "Производство и склад ЛКМ", "г. Санкт-Петербург", "ул. Маршала Новикова, д. 28", "проектирование", "Про", "", "factory"),
createPlacemark(new YMaps.GeoPoint(30.644346, 60.014666), "Производственно-складской комплекс", "Ленинградская обл., г. Всеволожск", "", "проектирование", "Про", "", "factory"),
createPlacemark(new YMaps.GeoPoint(37.348743,44.898349), "Гипермаркет \"Магнит\"", "г. Анапа", "Анапское шоссе, д. 14", "проектирование, монтаж", "Тор", "1587", "magnit"),
createPlacemark(new YMaps.GeoPoint(39.058138,45.025024), "Гипермаркет \"Магнит\"", "г. Краснодар", "ул. Лизы Чайкиной, д. 2/1", "проектирование, монтаж", "Тор", "1582", "magnit"),
createPlacemark(new YMaps.GeoPoint(38.088209,44.553048), "Гипермаркет \"Магнит\"", "г. Геленжик", "ул. Советская, д. 71", "проектирование, монтаж", "Тор", "1745", "magnit"),
createPlacemark(new YMaps.GeoPoint(36.956017,56.198891), "Гипермаркет \"Магнит\"", "Московская обл., г. Солнечногорск,", "ул. Красная, д. 161", "проектирование, монтаж", "Тор", "1583", "magnit"),
];
var groups_t = ["Торговля","Торговля","производство","авто"]
var group1 = new YMaps.GeoObjectCollection();
var group2 = new YMaps.GeoObjectCollection();
//for (var i = 0; i < groups.length; i++) {
group1.add(groups);
//$("div[id=test]").append("вот так");
//}
//Создание групп по городам и типам
//Общая группа
var groupAll = new YMaps.GeoObjectCollection();
var groupFil = new YMaps.GeoObjectCollection();
//Группа Спб
var groupSpbTorg = new YMaps.GeoObjectCollection()
groupAll.add(groups);
groupAll.forEach(function (obj, objIndex, group) {
if ((groupAll.get(objIndex).metadataproperty == filterTypes[3]) && (groupAll.get(objIndex).description.indexOf('Мос') + 1)) {
groupSpbTorg.add(groupAll.get(objIndex));
$("div[id=test]").append(groupAll.get(0).metadatap roperty);
}
});
//Подсчет количества объектов для России и СПб
var r=0;
var s=0;
$("div[id=cityList]").append('<p>Всего объектов на карте:<strong> ' + groupAll.length() + '</strong></p>');
groupAll.forEach(function (obj, objIndex, group) {
if (!(groupAll.get(objIndex).description.indexOf('Сан кт-Петербург') + 1)) {
r=r+1;;
}
if ((groupAll.get(objIndex).description.indexOf('Санк т-Петербург') + 1)) {
s=s+1;;
}
});
jQuery.each(filterCity, function(i) {
$("div[id=cityList]").append('<input type="radio" name="City" id="' + filterCitys[i] + '"><label id="' + filterCitys[i] + '">' + this + '</label><br>');
});
//Если выбран пункт "Россия"
$(":radio[id=Ros]").click (function (){
map.setCenter(new YMaps.GeoPoint(38.59582,53.321534), 4);
map.removeAllOverlays();
groupFil.removeAll();
groupAll.forEach(function (obj, objIndex, group) {
if (!(groupAll.get(objIndex).description.indexOf('Сан кт-Петербург') + 1)) {
groupFil.add(groupAll.get(objIndex));
}
});
jQuery.each(filterTypes, function(i) {
var j=0;
groupFil.forEach(function (obj, objIndex, group) {
if(groupFil.get(objIndex).metadataproperty == filterTypes[i]) {
j=j+1;
}
});
$("input:checkbox[id=filterTypes[i]] > label").text(filterType[i] + "[" + j + "]");
});
map.addOverlay(groupFil);
});
//Если выбран пункт "Санкт-Петербург"
$("input:radio[id=SPb]").click (function (){
map.setCenter(new YMaps.GeoPoint(30.313497,59.938531), 10);
map.removeAllOverlays();
groupFil.removeAll();
groupAll.forEach(function (obj, objIndex, group) {
if ((groupAll.get(objIndex).description.indexOf('Санк т-Петербург') + 1)) {
groupFil.add(groupAll.get(objIndex));
}
});
map.addOverlay(groupFil);
});
jQuery.each(filterType, function(i) {
$("div[id=typeList]").append('<input type="checkbox" disabled name="Type" id="' + filterTypes[i] + '"><label>' + this + '</label><br>').click (function (){
group1.forEach(function (obj, objIndex, group) {
var i=0;
if (groups_t[objIndex].indexOf("ав") + 1) {
group2.add(groups[objIndex]);
$("div[id=test]").append(group2[i].getStyle);
i=i+1;
}
});
map.addOverlay(group2);
});
return (this != "four"); // will stop running to skip "five"
});
$("input[type=checkbox]").change(function(){
if($(this).is(":checked")){
$("div[id=test]").append("вот так");
}
});
//Добавляем количество объектов по городам
$("label[id=Ros]").append('  <strong> [' + r + ']</strong>');
$("label[id=SPb]").append('  <strong> [' + s + ']</strong>');
//Делаем объекты Россия автивными
$(":radio[id=Ros]").click();
});
function createPlacemark (point, name, city, address, workType, filtred_, pr_no, pr_type) {
// Создание стиля метки
var s = new YMaps.Style();
s.iconStyle = new YMaps.IconStyle();
if (pr_type == "magnit") {
s.iconStyle.offset = new YMaps.Point(-10, -16);
s.iconStyle.size = new YMaps.Point(19, 16);
s.iconStyle.href = "http://i070.radikal.ru/0912/90/91a7c1a099b5.png";
var placemark = new YMaps.Placemark(point, {style: s});
}
else if (pr_type == "o-key") {
s.iconStyle.offset = new YMaps.Point(-12, -26);
s.iconStyle.size = new YMaps.Point(24, 26);
s.iconStyle.href = "http://s50.radikal.ru/i128/0912/36/f2284c9c7d71.pn ";g
var placemark = new YMaps.Placemark(point, {style: s});
}
else {
var placemark = new YMaps.Placemark(point, {style:"default#"+pr_type+"Icon"});
}
placemark.name = name;
placemark.description = '<p>' + city + '<br>' + address + '<br></p><p><a href="/projects/' + pr_no + '">подробнее...</a></p>' ;
placemark.metadataproperty = filtred_;
return placemark;
}
</script>
<style type="text/css">
div .city_List
{
border: 0px solid black;
padding: 5px;
margin-bottom: 5px;
height: 130px;
width: 200px;
}
div .type_List
{
border: 0px solid black;
padding: 5px;
margin-bottom: 5px;
height: 130px;
width: 200px;
}
</style>
<table>
<tr><td>
<div id="cityList" class="city_List"></div></td>
<td>
<div id="typeList" class="type_List"></div></td>
</tr>
</table>
<div id="YMapsID" style="width:590px;height:400px"></div>