четверг, 28 июня 2007 г.

Google Mapplets: Концепция и примеры. Введение

Оригинальный документ находится по адресу
http://www.google.com/apis/maps/documentation/mapplets/.

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


Маплеты (Google Mapplets) это мини-приложения, которые можно встраивать в сайт, использующий технологию Google Maps. Примеры использования включают в себя поиск местоположения, отображение текущей погоды и измерение дистанции. Маплеты представляют собой набор инструментов, которые предоставляет Вам Google для управления картой путем программирования на Javascript вызовов Google Maps API.
Маплеты пока доступны только в предварительной версии для разработчиков Google Maps по адресу
http://maps.google.com/preview

Сегодня маплеты новинка, в которой могут быть обнаружены ошибки, документация также еще далека от идеала. Желающие могут присоединиться к группе обсуждения Maps API, внеся свой вклад в дальнейшее развитие представленной технологии.

Для кого написано это руководство

Статья рассчитана на JavaScript программистов, понимающих идеи объектно-ориентированного программирования. Маплеты это набор совместно используемых инструментов, так что не забывайте заглядывать в документацию по Google Gadgets API. Если Вы уже хорошо знакомы с Google Maps API, можете сразу перейти к разделу "Отличия маплетов от стандартного картографического API".

Что такое маплеты

Маплеты это небольшие веб-странички, размещаемые в элементе IFrame на сайте Google Maps. Вы можете разместить на этих страничках все то же, что и на обычных, включая HTML, Javascript и Flash. Google обеспечивает Javascript API, предоставляющий маплетам доступ к сервисам управления картой, получения контента из другого источника и сохранения настроек пользователя.
Когда пользователь публикует маплет, сервера Google's запрашивают исходный код маплета с Вашего вебсервера и потом публикуют его копию на сайте gmodules.com. Для уменьшения нагрузки на Ваш сервер сайт gmodules.com будет кэшировать исходный код в течении нескольких часов.

Основные средства разработчика

Прежде чем Вы начнете разрабатывать маплеты, перейдите к секции "Developer Tools" в директории Mapplets Content Directory и возьмите следующие утилиты:
Developer Mapplet: После установки утилиты в каждом запущенном маплете появится ссылка "Reload", которая позволит Вам отключить автоматическое кэширование исходного кода Ваших маплетов.
Mapplet Scratch Pad: Утилита обеспечивает возможность интерактивно писать код маплета и немедленно видеть результат выполнения. Вы можете скопировать и вставить код любого из примеров в Scratch Pad.

Очень простой маплет "Здравствуй, мир!"

Поскольку все маплеты представляют собой Google Gadgets, мы начнем с написания спецификации маплета, которая представляет собой XML-код с метаданными. Отображаемый пользователю HTML размещается в тэге , в котором Вы можете разместить любой HTML-код так же, как Вы это делаете на своих веб-страницах.

Нижеследующий пример отобразит надпись "Здравствуй, мир!" в левой панели.

<?xml version="1.0" encoding="UTF-8"?>
<Module>
<ModulePrefs title="Hello World"
description="The Hello World of Gadgets"
author="Your name"
author_email="your-email@gmail.com"
height="150">
</ModulePrefs>
<Content type="html"><![CDATA[

<h2>Здравствуй, мир!</h2>

]]></Content>
</Module>

Теперь добавим это описание в наш маплет. Инструкция внутри тэга обеспечит загрузку Mapplets Javascript API, необходимого для работы с картой.
В тэге добавим некоторый Javascript код, который обращается к этому API. Первая строка var map = new GMap2() создаст указатель на главную карту, вызов методов которого позволяет управлять объектом карта аналогично тому, как это делается с помощью вызовов Google Maps API.

Пример ниже уменьшает изображение и добавляет метку на карту с подписью "Привет, мир!".

<?xml version="1.0" encoding="UTF-8"?>
<Module>
<ModulePrefs title="Hello World"
description="The Hello World of Mapplets"
author="Your name"
author_email="your-email@gmail.com"
height="150">
<Require feature="sharedmap"/>
</ModulePrefs>
<Content type="html"><![CDATA[

<h2>Привет, мир!</h2>

<script>
// Center the map in the Mediterranean and zoom out to a world view
var map = new GMap2();
var point = new GLatLng(37.71859, 6.679688);
map.setCenter(point, 2);

// Add a marker to the center of the map
var marker = new GMarker(point);
map.addOverlay(marker);

// Open a "Hello World" info window
var message = "Hello World!";
marker.openInfoWindowHtml(message);
</script>

]]></Content>
</Module>


Публикация и установка маплета

После создания маплета необходимо сохранить его на общедоступном сайте. Если у Вас нет своего собственного сайта, мы рекомендуем Вам попробовать Google Page Creator. Только не используйте визуальный HTML редактор! Вместо этого воспользуйтесь опцией загрузки файла в разделе Site Manager (ссылка на загрузку расположена справа). Потом кликните на имени загруженного файла в секции загруженных элементов, чтобы узнать полный адрес файла на сайте.
Для установки маплета перейдите в директорию маплетов (Mapplets Directory) и щелкните ссылку "Add by URL", расположенную после кнопки "Search Google Maps Content" вверху страницы. Введите URL Вашего маплета и нажмите кнопку "Add". Теперь Ваш маплет будет доступен на вкладке "Mapplets", когда Вы вернетесь к Google Maps.
Примечание: вышеописанный способ установит маплет только для вашей учетной записи, маплет не будет опубликован для всех пользователей. Если Вы хотите с кем-то поделиться Вашим маплетом, необходимо переслать ему URL Вашего маплета.

Размещение Вашего маплета в каталоге

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

Подводим итоги

Введение мы прочитали (если нет, советую все же это сделать, согласитесь, теорией я Вас не утомляю), в оригинальной документации еще много чего написано, но пора бы уже и самим что-то сделать, а оригинал продолжим читать в другой раз. Итак, займемся размещением карты на своем сервере. Если честно, прочитав англоязычное описание технологии, я сам многое не понял, но это не беда, в следующей статье я расскажу Вам, что же именно я не понял. Комментарии добавлять и переделывать текст я не стал, раз уж назвал переводом, пусть так и будет. Итак, читайте:
Google Mapplets: Начинаем работу.

Комментариев нет:


(C) Alexey Pechnikov aka MBG, mobigroup.ru