Итак, мы прочитали статью Google Mapplets: Концепция и примеры. Введение или ее оригинальный вариант на сайте Google, теперь хотим сделать что-нибудь сами. Разумеется, не для своей учетной записи в Google, а в общем доступе на своем сайте 😀 Я не буду разделять маплеты и просто Google Maps API, хотя это не одно и то же, но из маплета можно скопировать код в обычную веб-страничку, также можно код Google Maps API оформить как маплет (не всегда, об этом пойдет речь в последней статье цикла). Будем просто рассматривать способы создания нужных нам приложений, а для удобства я использую название “маплет” как для кода Google Maps API в веб-страницах, так и для Google Mapplets. В тех случаях, когда речь будет идти исключительно о технологии Mapplets мы будем пользоваться термином “настоящий” маплет.
Первым делом нам нужно получить некий ключ, который позволит запускать маплеты со своего сайта. Дело в том, что скрипт, обслуживающий маплеты, проверяет этот самый ключ и если URL директории с маплетом не соответствует ключу, маплет не запускается. Правда, Вы можете скачать сам скрипт (http://maps.google.com/maps?file=api&v=2&key) и отключить в нем проверку ключа сайта (проверяется значение переменной GValidateKey), но будем надеяться, что Вы этого не сделаете, а отправитесь на страничку Google Maps API – Sign Up и честно получите ключ для своего сайта. На мой взгляд, условия использования довольно либеральные (полмиллиона просмотров в сутки, 50 тысяч запросов на геокодирование, общий доступ к сайту, не менять логотип на карте). Достаточно указать URL директории, в которой Вы планируете размещать маплеты и гугл сообщит Ваш ключ и предложит пример маплета, который вы можете тут же сохранить на Вашем сайте и насладиться работой своего первого маплета. Вот этот пример, запущенный на моем сайте: простой маплет.
Заглянул на страничку с правилами для корпоративного использования, там все туманно, но есть одна “зацепка” – корпоративная лицензия стоит от 10 тысяч долларов в год. Немало, но паршивая карта Москвы (в формате MapInfo, с откровенно кривой топологией и атрибутикой в отдельных слоях) обойдется существенно дороже. Притом с условием использования только для одного клиента… А тут весь мир на карте. Есть о чем задуматься. А поскольку я очень “люблю” Роскартографию (притом взаимно, впрочем, я-то им ничего плохого не делал, а вот они мне…), то надеюсь, что Вы задумаетесь.
Зная то, о чем я Вам сейчас рассказал, нетрудно разместить пример из предыдущей статьи на своем сервере, см. здесь. Замечу мимоходом, что русский язык поддерживается, надписи на карте выводятся как им положено. Я использовал кодировку веб-страницы cp1251 (charset=windows-1251). Во избежание изматывающей дискуссии о том, какая кодировка “правильнее”, предлагаю Вашему вниманию эту же страницу, но в юникоде. Сделал вот так:
cat hello.html |iconv -f cp1251 -t utf8 >hello_u.html
и заменил в коде странички charset=windows-1251 на charset=utf-8. Как видим, и в этом случае все работает правильно, на чем тему кодировок позвольте считать закрытой.
А теперь сделаем страничку чуть сложнее, вот такую. На этой карте мы добавили элементы управления и поставили метку с надписью. Получили вполне информативную картинку, которую можно использовать на своем сайте (ну, например, чтобы друзья не забывали, где Вы живете – в наш век интернет случается и такое). Код странички простой, можете сами посмотреть, а координаты метки хранятся в файле data2.xml, расположенном в одной директории с файлом странички (да, свалка получается, надо будет переложить, но идею Вы поняли). Вот содержимое этого файла:
<markers>
<marker lat="56.2889" lon="43.940491"/>
</markers>
Вот так выглядит javascript код:
function load()
if (GBrowserIsCompatible())
var map = new GMap2(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
map.setCenter(new GLatLng(56.2889, 43.940491), 12);
var infoTabs1 = [
new GInfoWindowTab("Центр города",
"Эту точку гугл эф считает центром Нижнего Новгорода"),
];
GDownloadUrl("data2.xml", function(data)
var xml = GXml.parse(data);
var markers =
xml.documentElement.getElementsByTagName("marker");
var point1 = new GLatLng(
parseFloat(markers[0].getAttribute("lat")),
parseFloat(markers[0].getAttribute("lon")));
var marker1=new GMarker(point1);
map.addOverlay(marker1);
GEvent.addListener(marker1, "click", function()
marker1.openInfoWindowTabsHtml(infoTabs1);
);
marker1.openInfoWindowTabsHtml(infoTabs1);
});
}
}
Для отображения нескольких точек и подписей к ним несложно расширить наш пример, это я предоставляю Вам, чтоб не скучно было.
Отлично, карта готова и ее может увидеть каждый посетитель Вашего сайта. Теперь Вы можете оформить созданный код в маплет и пользоваться им как кирпичиком при построении сайтов. Можно даже предоставить всем желающим этот “строительный элемент”, если только Google сочтет его достойным внимания и включит в свой каталог.
В интернет можно встретить немало сервисов, использующих карты для улучшения восприятия материала. Например, в научных публикациях на картах отмечают события или значения исследуемых параметров, путешественники привязывают сделанные фотографии к отображаемому на карте трэку с GPS-навигатора, тематические сообщества пользователей составляют карты интересующих их мест и добавляют описания… Зачастую проще показать на карте, чем долго объяснять словами. В качестве примеров привожу набор ссылок, пусть их подборка несколько случайна, но я надеюсь, примеры помогут Вам определить, в каких областях работы или досуга будут полезны интерактивные карты.
- GPS-Club: Мои POI
В следующий раз мы научимся оформлять карту и добавлять к ней разные “фишки”.
автор: Печников Алексей Олегович
e-mail: [email protected]
сайт: http://mobigroup.ru
Cтатья является собственностью GPSClub.ru, все права на материал принадлежат GPS Club. ru (c)
При полной или частичной перепечатке материала обязательна гиперссылка на www.gps-club.ru
Обсудить статью на форуме.
10.07.2007
About The Author
