INT 21h

Домашняя страница самого страшного прерывания

Использование API 2ГИС для создания карт с вашей собственной информацией

№ 4167 В разделе "Программирование" от March 21st, 2012,

На сайте 2ГИС уже есть классный пример использования API (спасибо тебе, 2ГИС! Я твой преданный юзер уже много лет). Давайте поиграем с ним!

Допустим, я люблю радиодетали и хочу поделиться всеми любимыми магазинами с друзьями. Всего этих магазинов 6. Давайте составим список с координатами и названиями.

    //массивы с описаниями магазинов
    var arr_luch = [84.983202,56.459649,"Магазин Луч<br><a href='http://md.tomsk.ru/'>
            http://md.tomsk.ru</a>"];
    var arr_trigger = [84.964294,56.464543, "Магазин Триггер<br><a href='http://trigger.ru/'>
            http://trigger.ru</a>"];
    var arr_elco = [84.951502,56.493721,"Элко-Про - радиодетали, приборы, конструкторы<br>
            <a href='http://elcopro.ru'>http://elcopro.ru</a>"];
    var arr_elco2 = [84.976156,56.452638,"Филиал Элко-Про - конструкторы, роботы, может
            выдавать заказы с сайта<br><a href='http://elcopro.ru'>http://elcopro.ru</a>"];
    var arr_elgrad = [84.961025,56.463460,"Элград и Вольт мастер - радиодетали<br>
            <a href='http://tom-electron.ru/'>http://elgrad.net</a>"];
    var arr_tomelectron = [84.954648,56.459210,"ТомЭлектрон - радиодетали<br>
            <a href='http://tom-electron.ru/'>http://tom-electron.ru</a>"];

    //массив магазинов
    var shops = [arr_luch, arr_trigger,arr_elco, arr_elco2,arr_elgrad,arr_tomelectron];

В примере показано создание только 1 метки с подсказкой. Мы же сделаем 6. Добавим в программу цикл по элементам массива магазинов.

for(var zi = 0; zi < shops.length; zi++) with({zi: zi}) {
..
}

Чтобы имена переменных не путали нам карты, мы сделаем их уникальными с помощью eval (добавит в имя переменной другую переменную).

var b = new DG.Balloons.Common({
    // Местоположение на которое указывает балун:
    geoPoint: new DG.GeoPoint(shops[zi][0],shops[zi][1]),
    // Текст внутри балуна":
    contentHtml: shops[zi][2]
});
eval("var baloon"+zi+"=b");

Тоже самое нужно сделать и для кода создания метки.

            // Создаем маркер:
            var m = new DG.Markers.Common({
                // Местоположение на которое указывает маркер
                //(в нашем случае, такое же, где и балун):
                geoPoint: new DG.GeoPoint(shops[zi][0],shops[zi][1]),
                // Функция, которая будет вызвана при клике по маркеру:
                clickCallback: function() {
                    // Если балун еще не был добавлен:
                    if (! myMap.balloons.getDefaultGroup().contains(eval("baloon"+zi))) {
                        // Добавить балун на карту:
                        myMap.balloons.add(eval("baloon"+zi));
                    } else {
                    // Если балун уже был добавлен на карту, но потом был скрыт:
                        // Показать балун:
                        eval("baloon"+zi).show();
                    }
                }
            });
            eval("var metka"+zi+"=m");

Добавляем маркер на сайт

myMap.markers.add(eval("metka"+zi));

И теперь вот что получается (клик по картинке ведет на живой пример)

На Яндекс.Картах я сделал абсолютно аналогичным способом программу для одного предприятия. Бригаде ремонтников достаточно зайти на корпоративный портал, чтобы увидеть все, что им необходимо. Поиск координат объектов осуществляется на стадии подключения абонента к сети с помощью специального API от Яндекса. Просто вводите адрес, а программа сама найдет координаты запросом

http://psearch-maps.yandex.ru/1.x/?text=ул калинина 14&key=...

Нет комментариев »

Оставьте ваш комментарий »

Форма отправки комментария

CAPTCHA
*

Разрешенные HTML-теги:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

RSS RSS Feed только для этого поста |


Комментарии
  • Игорь: Все настроил, еще раз просмотрел видео и методом научного тыка все настроил и сохранил, все работает и обе...
  • 21h: Здравствуйте, Игорь! Я не знаю :) Думаю аналогично согласно инструкции к вашей радиостанции.
  • Игорь: Добрый день, просмотрел Ваше видео все доступно и ясно для 8 ми канальных радеек, но мне нада настроить 69...
  • Гоги: Есть инструкция к Моторолкам – она подходит к серии Motorola TLKR T4… Т8. В конце сетка частот и...
  • 21h: торчок давно уже не обновлял, как только закрыл сайт где он работал. да, это морда для opentracker. без...
  • Buter: Какова дальнейшая жизнь торчка? Он кстати веб-интерфейсом для OpenTracker выступает? Без OpenTracker работать...
  • 21h: понятия не имею. гуглите инструкцию к вашей радейке и сверяйтесь с ней.
  • Денис: хочу их подружить с uv5r
  • Денис: t-388 walkie talkie на эти шпаргалочек нет,или как приминить ваши к их настройке?
  • John: Стекла для электроник – техночас.ру