Примеры использования JavaScript API

1. Основы, использование карты

2. Загрузка API на страницу

3. Метки (значки, отмечающие места на карте)

4. Балуны (окна, всплывающие при клике на метку)

5. Ломаные

6. Многоугольники

7. Элементы управления картой (масштабная линейка, лупа и т.п.)

8. Всплывающие подсказки

9. Объединение объектов в группы, управление группами

10. Диспетчер объектов

11. Создание своих объектов-оверлеев

12. Определение координат по адресу и определение адреса по координатам (Геокодер)

13. Построение автомобильных маршрутов и работа с ними (Маршрутизатор)

14. Работа с XML-файлами, описывающими геоданные

15. Обработка событий карты

16. Карты, координатные системы

1. Основы, использование карты

(Подробнее читайте «Руководство разработчика» / «Основы»)

• Вызов карты

• Использование слоя «гибрид» вместо cлоя «схема».

• Удаление карты со страницы по щелчку мыши.

• Инициализация карты по требованию из скрытого контейнера. Вначале отображается контейнер, а потом инициализируется карта.

• Отображение карты в скрытом диве. Боремся с «серой картой» с помощью метода карты redraw().

• Размещение нескольких карт на одной странице.

• Включение плавного перемещения карты.

• Синхронизация двух карт. При перемещении карты и смене масштаба на одной из них, на второй - эти действия дублируются.

• Пример, использующийся на главной странице промо-сайта.

2. Загрузка API на страницу

(«Руководство разработчика» / «Загрузка API»)

• Загрузка карты по требованию при клике на кнопку.

• Демонстрация стандартного сообщения об ошибке «Неправильный ключ"».

• Замена стандартного сообщения «Неправильный ключ» на собственное.

3. Метки (значки, отмечающие места на карте)

(«Руководство разработчика» / «Метка») Добавление меток на карту. Задание текста для значка метки. Включение режима перетаскивания метки. Использование стандартных значков меток. Использование собственного значка для метки. Смена значка у метки при наведении курсора мыши. Применение собственного шаблона для метки.

4. Балуны (окна, всплывающие при клике на метку)

(«Руководство разработчика» / «Балун») Показ балуна после клика на метку. Показ балуна на карте без метки. Задание собственного шаблона оформления содержимого балуна. Создание макета балуна для полного изменения его внешнего вида.

5. Ломаные

(«Руководство разработчика» / «Ломаная») Добавление ломаной на карту. Формирование ломаной из строки закодированных вершин. Задание стиля для ломаной. Ломаная с влюченным режимом редактирования. Рисование ломаной нажатиями левой кнопки мыши. Добавление своего пункта в контекстное меню редактирования ломаной. Реализация завершения пользователем режима редактирования.

6. Многоугольники

(«Руководство разработчика» / «Многоугольник») Добавление многоугольника на карту. Многоугольник с включенным режимом редактирования. Задание стиля для многоугольника. Рисование круга на основе многоугольника.

7. Элементы управления картой (масштабная линейка, лупа и т.п.)

(«Руководство разработчика» / «Управление картой») Добавление стандартных элементов управления на карту. Выпадающий список типов карт вместо трёх кнопок. Добавление на карту собственного элемента управления (в данном случае список офисов). Задание собственных всплывающих подсказок для линейки масштабирования. Размещение собственной кнопки на панели инструментов. Пример дополнительной кнопки на панели инструментов (еще одна линейка). Разворачивание карты на весь экран по нажатию на специально созданную кнопку. Изменение положения элементов управления. Удаление одного из элементов управления по щелчку на карте.

8. Всплывающие подсказки

(«Руководство разработчика» / «Всплывающая подсказка») Пример всплывающей подсказки около центра Москвы. Включение всплывающей подсказки у метки. Задание собственного шаблона для всплывающей подсказки.

9. Объединение объектов в группы, управление группами

(«Руководство разработчика» / «Группировка объектов»)

• Добавление группы объектов на карту.

• Пример работы с несколькими группами объектов на карте.

• Пример работы с группой меток. Пользователь имеет возможность перемещать метки.

• Задание стиля для группы объектов.

10. Диспетчер объектов

(«Руководство разработчика» / «Диспетчер объектов»)

• Применение диспетчера объектов. От масштаба зависит количество отображаемых меток и их стиль.

11. Создание своих объектов-оверлеев

(«Руководство разработчика» / «Создание пользовательских объектов»)

• Создание собственного оверлея (размечены вокзалы Москвы).

• Ломаная линия со стрелочками, указывающими её направление.

12. Определение координат по адресу и определение адреса по координатам (Геокодер)

(«Руководство разработчика» / «Геокодирование»)

• Создание вынесенной строки поиска.

• Получение наименования объекта по его координатам.

• Инициализация карты по координатам, полученным от геокодера.

• Аналог инструмента «Информация» Яндекс.Карт.

• Множественное геокодирование с использованием JS-геокодера.

13. Построение автомобильных маршрутов и работа с ними (Маршрутизатор)

(«Руководство разработчика» / «Маршрутизатор»)

• Добавление маршрута на карту.

• Добавление маршрута и обработка события загрузки маршрута.

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

• Анимирование маршрута движения от точки, указанной пользователем, к заданному месту.

14. Работа с XML-файлами, описывающими геоданные

(«Руководство разработчика» / «Отображение YMapsML»)

• Визуализация YMapsML-файла.

• Визуализация KML.

• Визуализация GPX-трека

15. Обработка событий карты

(«Руководство разработчика» / «События»)

• Создание обработчика события. При щелчке на карте отображается сообщение «Щелк».

• Использование своего контекста в обработчике события. Подсчет кликов мышкой.

• Открытие балуна с координатами и значением масштаба при щелчке кнопкой мыши на карте.

• Создание ссылки на фрагмент карты, используя якорь.

• Создание ссылки на фрагмент карты. Ссылка выдаётся по клику «Получить адрес страницы».

• Удаление обработчика событий. При щелчке на карте добавляется метка и обработчик событий удаляется.

16. Карты, координатные системы

(«Руководство разработчика» / «Пользовательские карты»)

• Создание своего типа карты.

• Создание своей координатной системы. Просмотр карты Чёрного моря.

• Создание своей координатной системы. Просмотр карты звёздного неба.

• Создание своей координатной системы. Просмотр фотографии в высоком разрешении.

• Создание своей координатной системы. Просмотр чертежа.

• Создание своего тайла.

• Вывод на экран сообщения с тайловыми координатами.