Только HTML для создания карт Google Maps. Часть 1. Введение

Воистину интернет мир чудес и нет числа сокровищам его! Стоит о чем-то помечтать и обратиться к поисковику - и вот она, мечта, на заветном блюдечке. А помечталось мне о том, что хорошо бы работать с картами гугл без всяких скриптов, на чистом html. ? что бы Вы думали? Есть такой способ! Удивился, проверил - работает. Вот о нем и расскажу. Это как бы логическое продолжение предыдущей статьи, где мы также создавали карту, не прибегая к программированию. Будет у нас парочка способов, на выбор.

Желающие потренироваться в английском могут это сделать вот здесь: http://n01se.net/chouser/gmapez/start.html А мы с Вами будем общаться на нормальном, русском языке :-)

Вот простенький пример, для которого не нужно писать ни одной строчки скриптового кода: http://support.mobigroup.ru/files/google_maps_html/simple.html. Карту можно перетаскивать мышкой. Нравится? Мне тоже. Добавить элементы управления и метки проще пареной репы, сейчас Вы в этом убедитесь.

Разработчики просят указывать их логотип, если мы создаем карту на своем сервере. Логотип небольшой и симпатичный, обязательно укажем.

alt="Powered By GMapEZ"
src="http://bluweb.com/chouser/gmapez/poweredbygmapez.jpg"
style="width:73px;height:25px;border:none;" />

Результат приведен на картинке.

Чтобы изменить окно просмотра на карте нужно добавить метку или указать экстент карты, иначе карта будет отображать Fort Wayne, Indiana.
В приведенном выше коде ключевым моментом является задание директивы class="GMapEZ" тэге

; если этого не сделать, код будет обработан как обычный

и карта не отобразится.

Добавление метки

Xтобы создать метку для карты, нужно зайти на сайт maps.google.com/, дважды щелкнуть на точке, где должна будет размещаться метка и нажать "Ссылка на эту страницу".
Примечание: требуется именно дважды щелкнуть на карте или перетаскивать карту, после поиска по адресу необходимо дважды щелкнуть на нужном месте или переместить карту мышью. Теперь скопируйте полученный адрес URL в обыкновенный тэг аналогично нашему примеру:

Если Вы не видите символов "ll=" во вставленном адресе URL, он не корректен - не забывайте после поиска адреса переместить карту или дважды щелкнуть на ней. Также отметим, что тип полученной карты соответствует режиму карты, для которой скопирована ссылка - мы это делали для спутниковой карты (тип "satellite").

Добавление нескольких меток

Чтобы создать несколько меток, просто укажите нужное количество тэгов :

?зменение типа карты

Чтобы изменить тип отображаемой карты, добавьте G_MAP_TYPE, G_SATELLITE_TYPE или G_HYBRID_TYPE в атрибуты класса. Приведем пример, как сделать карту типа G_HYBRID_TYPE:

    style="width: 300px; height: 300px;">
  
  
                  

Примечание: идентификатор G_MAP_TYPE используется Google для стандартной карты улиц.

                  

                  Вы также можете позволить пользователю изменять тип карты во время работы, для этого нужно лишь добавить на карту элемент управления типом карты (как это сделать, мы узнаем далее).

                  

                  Буквенные и цветные метки

                  

                  Все созданные нами метки имеют стандартное оформление. Кроме того, мы можем воспользоваться любой строчной или прописной буквой, цифрой, знаком #, знаком $, знаком START (закрашенный треугольник, указывающий вправо), или END (закрашенный квадратик). Начиная с версии GMapEZ 2.2, доступны свойства значков MINI и BLANK. А в версии GMapEZ 2.3 также можно использовать свойство INVISIBLE (невидимый) - такие значки не отображаются на карте, однако чувствительны к нажатию и могут быть полезны для отображения окна информации. Перечисленные иконки можно делать цветными, используя следующие названия цветов: ORANGE, PURPLE, YELLOW, GREEN, BLUE, RED, AQUA, WHITE и GRAY. Название символа и цвет следует писать внутри тэга :

                  

    style="width: 300px; height: 300px;">
  
    A
  
  
    YELLOW MINI
  
  
    PURPLE END
  
  
    GREEN START
  


                  

                  
автор: Печников Алексей Олегович

                  e-mail: [email protected]

                  сайт: http://mobigroup.ru

                  

                  P.S. Маплет GPS Клуба "Мои POI" можно посмотреть здесь

                  

                  

                  
Cтатья является собственностью GPSClub.ru, все права на материал принадлежат GPS Club. ru (c)

                  При полной или частичной перепечатке материала обязательна гиперссылка на gps-club.ru            

                   
                  
Обсудить статью на форуме.


                  

                  
28.07.2007