![Page 1: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/1.jpg)
Яндекс.Карты: между пользователем и
разработчиком
Федор Голубев[email protected]
Леонид Шныр[email protected]
![Page 2: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/2.jpg)
Яндекс.Карты
– подробные карты Алматы и Астаны– 111 городов России
– 36 городов Украины
– карта всего мира
– много специальных технологий, инструментов
Яндекс.Карты:
![Page 3: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/3.jpg)
Яндекс.Карты
Схема СпутникГибрид
![Page 4: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/4.jpg)
API Яндекс.Карт — бесплатный сервис
![Page 5: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/5.jpg)
?
?
?
?
?
![Page 6: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/6.jpg)
– привязан к имени домена и логину на Яндексе
– для localhost и 127.0.0.1 подойдет любой ключ
– работает для поддоменов
– http://api.yandex.ru/maps/form.xml
API ключ
![Page 7: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/7.jpg)
JavaScript APIJavaScript APIинструмент взаимодействия с картойинструмент взаимодействия с картой
![Page 8: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/8.jpg)
– объектно-ориентированная библиотека
– одно пространство имен YMaps
– событийная модель
– jQuery внутри (1.3.2)
– 95 Кб (loadByRequire: 3 Кб)
– текущая версия 1.1 (1.1.4)
JavaScript API
![Page 9: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/9.jpg)
1. Подключаем API
2. Определяем место на странице
3. Создаем и инициализируем карту
Начало работы
<script src=“http://api-maps.yandex.ru/{версия}/key={ключ}”/>
<div id=“mapID” style=“width:200px; height:200px;”>
var map = new YMaps.Map(YMaps.jQuery(“#mapID”));map.setCenter(
new YMaps.GeoPoint(39.68,47.25), // центр10, // масштабYMaps.MapType.MAP // тип карты
);
JavaScript API
![Page 10: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/10.jpg)
– Встроенные возможности карты(Перемещение, Масштабирование двойным кликом мыши, Масштабирование колесиком мыши, Лупа, Выделение правой кнопкой мыши, Горячие клавиши, Линейка)
– Стандартные элементы управления(Поиск по карте, Панель инструментов, Переключатель типов карт, Элемент масштабирования, Маленький элемент масштабирования, Обзорная карта, Масштабная линия)
– Интерфейс YMaps.IControl – создание ваших элементов управления
Взаимодействие с пользователем
JavaScript API
![Page 11: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/11.jpg)
– МеткиYMaps.Placemark – точка
– ЛоманыеYMaps.Polyline – множество точек соединенных отрезками
– МногоугольникиYMaps.Polygon – область ограниченная замкнутой ломаной
– Интерфейс YMaps.IOverlay – создание ваших объектов
Объекты
JavaScript API
![Page 12: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/12.jpg)
– НастройкиYMaps.Style
значок и тень метки, цвет, толщина и заливка для ломаных и многоугольников
– Текстовые шаблоныYMaps.Template
значок метки, балун, всплывающая подсказка
– Динамические шаблоны – макетыYMaps.ILayout, YMaps.IPlacemarkLayout, YMaps.IHintLayout,YMaps.IBalloonLayout
значок метки, балун, всплывающая подсказка и содержимое каждого из них
Внешний вид объектов
JavaScript API
![Page 13: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/13.jpg)
– ГруппировкаYMaps.GeoObjectCollection
– Управление видимостьюYMaps.ObjectManager – только метки
– РедактированиеYMaps.PlacemarkOptions.draggable – перетаскивание
YMaps.(Polyline|Polygon).startEditing – визуальное редактирование
Управление объектами
JavaScript API
![Page 14: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/14.jpg)
JavaScript API
?
?
?
?
![Page 15: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/15.jpg)
• Здесь нужна картинка кальки
Static APIStatic APIвозвращает фрагмент карты в ответвозвращает фрагмент карты в ответ на на HTTPHTTP--запросзапрос
![Page 16: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/16.jpg)
– малый объем загружаемых данных(600x450: ~100 Кб)
– максимальная простота
– идеально для:– печати
– мобильных устройств
– картинок в блог
– схем проезда
Static API
![Page 17: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/17.jpg)
– Размерsize – размер изображения в пикселях
– Область показаll, spn или z – географические координаты центра и масштаб
– Тип картыl – список слоев (map, sat, skl)
– Объектыpm – метки (размер, цвет, номер)
pl – ломаные (цвет, ширина)
Настройки
Static API
![Page 18: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/18.jpg)
JavaScript API
Static API
?
?
?
![Page 19: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/19.jpg)
ГеокодерГеокодерпозволяет определять координаты и позволяет определять координаты и получать ведения о географическом получать ведения о географическом объекте по его названию или адресуобъекте по его названию или адресу
![Page 20: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/20.jpg)
– обратное геокодирование– определение адреса объекта по его координатам
– исправление опечаток
– задание начальной области поиска
– ограничение области поиска– искать только внутри области
– отдает все найденное в порядке релевантности
– постраничный вывод
Геокодер
![Page 21: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/21.jpg)
– Объект YMaps.Geocoderпрограммный интерфейс, возвращает набор меток
– Элемент управления YMaps.SearchControl
– http протоколhttp://geocode-maps.yandex.ru/1.x/
возвращает xml документ со списком объектов
Интерфейсы
Геокодер
![Page 22: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/22.jpg)
Static API
?
?
Геокодер
JavaScript API
![Page 23: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/23.jpg)
МаршрутизаторМаршрутизаторсервис автоматического прокладывания сервис автоматического прокладывания маршрутовмаршрутов
![Page 24: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/24.jpg)
– принимает на вход как координаты, так и адреса
– промежуточные точки
– объект YMaps.Router
– возвращает– протяженность и время
– маршрутный лист
– ломаную пути разбитую на сегменты согласно маршрутному листу
– beta, ездит только по Москве
Маршрутизатор
![Page 25: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/25.jpg)
Static API
?
Маршрутизатор
Геокодер
JavaScript API
![Page 26: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/26.jpg)
YMapsMLYMapsML((YMapsYMaps Markup Language) Markup Language) –– XML XML формат формат описания описания геопространственныхгеопространственных данныхданных
![Page 27: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/27.jpg)
– xml-формат работы с инструментами API
– данные + описание отображения
– базируется на стандарте GML (Geography ML)документы можно просматривать в браузерах GML
– не имеет ограничений на использование
– объект YMaps.YMapsML
– автоматическая симплификация ломаных и многоугольников
YMapsML
![Page 28: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/28.jpg)
Static API
YMapsML
Маршрутизатор
Геокодер
JavaScript API
![Page 29: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/29.jpg)
API Яндекс.Карт
Можно всё! что нужно )
– На сайте коммерческой фирмы? — можно!
– А если обязательная регистрация? — можно!
– И рекламу можно? — да!!!
Всё что нужно для успешного интернет-проекта?
— да!
![Page 30: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/30.jpg)
«Конструктор схем проезда» = карта за 2 минуты
Конструктор
+
![Page 31: Яндекс.Карты - между пользователем и разработчикомcache-ash03.cdn.yandex.net/download.yandex.ru/company/experienc… · – 111 городов](https://reader035.vdocuments.co/reader035/viewer/2022062306/5f02fbe77e708231d406f7cf/html5/thumbnails/31.jpg)
Вопросы?
Клуб – http://clubs.ya.ru/mapsapi/
Саппорт – [email protected]
Документация – http://api.yandex.ru/maps/doc/
Сайт API Яндекс.Карт – http://api.yandex.ru/maps/
Федор Голубев[email protected]
Леонид Шныр[email protected]