Фёдор Голубев, Леонид Шныр "Яндекс.Карты: между пользователем и разработчиком" Первый Я.Субботник в Алматы

1. Яндекс.Карты:
между пользователем и
разработчиком
Леонид Шныр Федор Голубев
mcrony@yandex-team.ru fgolubev@yandex-team.ru

2. Яндекс.Карты
Яндекс.Карты:
– подробные карты Алматы и Астаны
– 111 городов России
– 36 городов Украины
– карта всего мира
– много специальных технологий, инструментов

3. Яндекс.Карты
Схема Гибрид Спутник

4. API Яндекс.Карт — бесплатный сервис

5. ?
?
?
?
?

6. API ключ
– привязан к имени домена и логину на
Яндексе
– для localhost и 127.0.0.1 подойдет
любой ключ
– работает для поддоменов
– http://api.yandex.ru/maps/form.xml

7. JavaScript API
инструмент взаимодействия с картой

8. JavaScript API
– объектно-ориентированная библиотека
– одно пространство имен YMaps
– событийная модель
– jQuery внутри (1.3.2)
– 95 Кб (loadByRequire: 3 Кб)
– текущая версия 1.1 (1.1.4)

9. JavaScript API
Начало работы
1. Подключаем API
<script src=“http://api-maps.yandex.ru/{версия}/key={ключ}”/>
2. Определяем место на странице
<div id=“mapID” style=“width:200px; height:200px;”>
3. Создаем и инициализируем карту
var map = new YMaps.Map(YMaps.jQuery(“#mapID”));
map.setCenter(
new YMaps.GeoPoint(39.68,47.25), // центр
10, // масштаб
YMaps.MapType.MAP // тип карты
);

10. JavaScript API
Взаимодействие с пользователем
– Встроенные возможности карты
(Перемещение, Масштабирование двойным кликом мыши, Масштабирование
колесиком мыши, Лупа, Выделение правой кнопкой мыши, Горячие клавиши,
Линейка)
– Стандартные элементы управления
(Поиск по карте, Панель инструментов, Переключатель типов карт, Элемент
масштабирования, Маленький элемент масштабирования, Обзорная карта,
Масштабная линия)
– Интерфейс YMaps.IControl – создание ваших
элементов управления

11. JavaScript API
Объекты
– Метки
YMaps.Placemark – точка
– Ломаные
YMaps.Polyline – множество точек соединенных отрезками
– Многоугольники
YMaps.Polygon – область ограниченная замкнутой ломаной
– Интерфейс YMaps.IOverlay – создание ваших
объектов

12. JavaScript API
Внешний вид объектов
– Настройки
YMaps.Style
значок и тень метки, цвет, толщина и заливка для ломаных и многоугольников
– Текстовые шаблоны
YMaps.Template
значок метки, балун, всплывающая подсказка
– Динамические шаблоны – макеты
YMaps.ILayout, YMaps.IPlacemarkLayout, YMaps.IHintLayout,
YMaps.IBalloonLayout
значок метки, балун, всплывающая подсказка и содержимое каждого из них

13. JavaScript API
Управление объектами
– Группировка
YMaps.GeoObjectCollection
– Управление видимостью
YMaps.ObjectManager – только метки
– Редактирование
YMaps.PlacemarkOptions.draggable – перетаскивание
YMaps.(Polyline|Polygon).startEditing – визуальное редактирование

14. JavaScript API
?
?
?
?

15. • Здесь нужна картинка кальки
Static API
возвращает фрагмент карты в ответ на
HTTP-
HTTP-запрос

16. Static API
– малый объем загружаемых данных
(600x450: ~100 Кб)
– максимальная простота
– идеально для:
– печати
– мобильных устройств
– картинок в блог
– схем проезда

17. Static API
Настройки
– Размер
size – размер изображения в пикселях
– Область показа
ll, spn или z – географические координаты центра и масштаб
– Тип карты
l – список слоев (map, sat, skl)
– Объекты
pm – метки (размер, цвет, номер)
pl – ломаные (цвет, ширина)

18. JavaScript API
Static API
?
?
?

19. Геокодер
позволяет определять координаты и
получать ведения о географическом
объекте по его названию или адресу

20. Геокодер
– обратное геокодирование
– определение адреса объекта по его координатам
– исправление опечаток
– задание начальной области поиска
– ограничение области поиска
– искать только внутри области
– отдает все найденное в порядке релевантности
– постраничный вывод

21. Геокодер
Интерфейсы
– Объект YMaps.Geocoder
программный интерфейс, возвращает набор меток
– Элемент управления YMaps.SearchControl
– http протокол
http://geocode-maps.yandex.ru/1.x/
возвращает xml документ со списком объектов

22. JavaScript API
Static API
Геокодер
?
?

23. Маршрутизатор
сервис автоматического прокладывания
маршрутов

24. Маршрутизатор
– принимает на вход как координаты, так и адреса
– промежуточные точки
– объект YMaps.Router
– возвращает
– протяженность и время
– маршрутный лист
– ломаную пути разбитую на сегменты согласно
маршрутному листу
– beta, ездит только по Москве

25. JavaScript API
Static API
Геокодер
Маршрутизатор
?

26. YMapsML
(YMaps Markup Language) – XML формат
описания геопространственных данных

27. YMapsML
– xml-формат работы с инструментами API
– данные + описание отображения
– базируется на стандарте GML (Geography ML)
документы можно просматривать в браузерах GML
– не имеет ограничений на использование
– объект YMaps.YMapsML
– автоматическая симплификация ломаных и
многоугольников

28. JavaScript API
Static API
Геокодер
Маршрутизатор
YMapsML

29. API Яндекс.Карт
Можно всё! что нужно )
– На сайте коммерческой фирмы? — можно!
– А если обязательная регистрация? — можно!
– И рекламу можно? — да!!!
Всё что нужно для успешного интернет-проекта?
— да!

30. Конструктор
+
«Конструктор схем проезда» = карта за 2 минуты

31. Вопросы?
Клуб – http://clubs.ya.ru/mapsapi/
Саппорт – support@api-maps.yandex.ru
Документация – http://api.yandex.ru/maps/doc/
Сайт API Яндекс.Карт – http://api.yandex.ru/maps/
Леонид Шныр Федор Голубев
mcrony@yandex-team.ru fgolubev@yandex-team.ru