API Яндекс.Карт. Мастер-класс
Upcoming SlideShare
Loading in...5
×
 

API Яндекс.Карт. Мастер-класс

on

  • 4,105 views

Сергей Константинов, презентация к мастер-классу на UWDC-2010

Сергей Константинов, презентация к мастер-классу на UWDC-2010

Statistics

Views

Total Views
4,105
Views on SlideShare
4,100
Embed Views
5

Actions

Likes
0
Downloads
10
Comments
0

1 Embed 5

http://www.slideshare.net 5

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

API Яндекс.Карт. Мастер-класс API Яндекс.Карт. Мастер-класс Presentation Transcript

  • API Яндекс.КартМастер-класс
    Сергей Константинов
    twirl@yandex-team.ru
    • привязан к имени домена и логину на Яндексе
    • для localhostи 127.0.0.1 подойдет любой ключ
    • работает для поддоменов
    • можно перечислять несколько ключей через тильду (~)
    • http://api.yandex.ru/maps/form.xml
  • JavaScript API
    Начало работы
    Подключаем API
    Определяем место на странице
    Создаем и инициализируем карту
    <script src=“http://api-maps.yandex.ru/{версия}/?key={ключ}”/>
    <div id=“mapID” style=“width:200px; height:200px”/>
    // Выберем HTML-элемент с помощью встроенного jQuery
    var map = new YMaps.Map(YMaps.jQuery(“#mapID”)[0]);
    map.setCenter(
    new YMaps.GeoPoint(39.68,47.25),// центр
    10,// масштаб
    YMaps.MapType.MAP// тип карты
    );
  • JavaScript API
    Взаимодействие с пользователем
    • Встроенные возможности карты
    (Перемещение, Масштабирование двойным кликом мыши, Масштабирование колесом мыши, Лупа, Выделение правой кнопкой мыши, Горячие клавиши, Линейка)
    • Стандартные элементы управления
    (Поиск по карте, Панель инструментов, Переключатель типов карт, Элемент масштабирования, Маленький элемент масштабирования, Обзорная карта, Масштабная линия)
    • Интерфейс YMaps.IControl – создание ваших элементов управления
  • JavaScript API
    Элементы управления
    YMaps.TypeControl
    YMaps.SearchControl
    YMaps.ToolBar
    YMaps.Zoom
    YMaps.MiniMap
    YMaps.ScaleLine
  • JavaScript API
    Объекты
    • Метки
    YMaps.Placemark– точка
    • Ломаные
    YMaps.Polyline – набор точек
    • Многоугольники
    YMaps.Polygon – замкнутый набор точек
    • Интерфейс YMaps.IOverlay – создание ваших объектов
  • JavaScript API
    Управление объектами
    • Группировка
    YMaps.GeoObjectCollection
    • Управление видимостью
    YMaps.ObjectManager – только метки
    • Редактирование
    YMaps.PlacemarkOptions.draggable–перетаскивание
    YMaps.(Polyline|Polygon).startEditing – визуальное редактирование
  • JavaScript API
    Содержимое объектов
    • Содержимое значка метки
    placemark.setIconContent(“Текствнутри метки”);
    • Всплывающая подсказка
    object.setHintContent(“Текст всплывающей подсказки”);
    • Балун
    object.setBalloonContent(“<h3>Привет!</h3><p>Я балун!</p>”);
  • JavaScript API
    Внешний вид объектов
    • Настройки
    YMaps.Style
    Значок и тень метки, вид курсора, цвет и толщина линий для ломаных и многоугольников, заливка для многоугольников
    • Текстовые шаблоны
    YMaps.Template
    Значок метки, балун, всплывающая подсказка
    • Динамические шаблоны – макеты
    YMaps.ILayout, YMaps.IPlacemarkLayout, YMaps.IHintLayout,YMaps.IBalloonLayout
    Значок метки, балун, всплывающая подсказкаи содержимое каждого из них
  • JavaScript API
    Создание своей карты
    • Свои карточные слои
    YMaps.Layer, YMaps.TileDataSource
    Свой шаблон URL тайла, настройка прозрачности
    • Свои типы карты
    «Вклеивание» своей карты в карту Яндекса
    • API для фотографий и чертежей
    YMaps.CartesianCoordSystem
    Работа в прямоугольной системе координат c удобными единицами измерения
    • Свои координатные системы, слои и тайлы
    YMaps.ICoordSystem, YMaps.ICoordPoint, YMaps.ICoordBounds,YMaps.ILayer, YMaps.ITile
  • JavaScript API
    Тайловые координаты
    1024x1024
    256x256
    512x512
    TileCoordinates
    {x,y}
    {tileX,tileY, tileOffset}
  • JavaScript API
    Подготовка слоя тайлов
    • Загружаем изображение
    • Отмечаем опорные точки
    Карта готова!
  • Вопросы?
    Клуб –http://clubs.ya.ru/mapsapi/
    Блог – http://ymapsapi.ya.ru/
    Документация –http://api.yandex.ru/maps/doc/
    Сайт API Яндекс.Карт–http://api.yandex.ru/maps/
    Сергей Константинов
    twirl@yandex-team.ru