Урок - Маркеры в Google Maps API 3.

Главная » Курсы » Курс Google Maps 3, примеры использования. » Урок - Маркеры в Google Maps API 3.

Обучающий онлайн курс
Google Maps 3, примеры использования.

Лицензия: Копирование запрещено.

В этой части курса мы будем говорить о свойствах и методах Маркеров.

Маркеры создаются с помощью команды "new google.maps.Marker()":

var markerLatLng = new google.maps.LatLng(50.435132,30.55777);
var marker = new google.maps.Marker({
    position: markerLatLng,
    title:"Marker Title!"
});

При создании маркера возможно задать следующие параметры:

  • animation (Animation-объект) -     Which animation to play when marker is added to a map.
  • clickable (boolean) - флаг указывающий является ли маркер кликабельным. По умолчанию true.
  • cursor (строка) - курсор для отображения над маркером
  • draggable (boolean) - если true, маркер может быть перетянут. По умолчанию false.
  • flat (boolean) - если true, тень маркера не отображается.
  • icon (строка|MarkerImage-объект) Иконка для маркера.
  • map (Map-объект|StreetViewPanorama-объект) - карта/панорама на которой необходимо показать маркер.
  • optimized (boolean) - оптимизаци позволят сделать много маркеров как один статический элемент. По умолчанию оптимизация включена. Отключить оптимизацию для анимированных GIF или PNG изображений, или когда каждый маркер должен быть представлен отдельным DOM-элементом.
  • position (LatLng-объект) - позиция маркера. Обязательный параметр.
  • raiseOnDrag (boolean) - если false, отключает приподнимание и опускание маркера при перемещении маркера. По умолчанию true.
  • shadow (строка|MarkerImage-объект) - указывает изображение тени.
  • shape (MarkerShape-объект) - карта изображения определяющая активную зону для кликов/захватов.
  • title (строка) - текст при выделении.
  • visible (boolean) - флаг видимости/скрытости маркера на карте.
  • zIndex (число) - zIndex относительно других фигур.

Для работы с объектом-маркером доступны следующие методы:

  • getAnimation() - возвращает Animation-объект, текущую анимацию.
  • getClickable() - возвращает логическое значение, указывающее является ли маркер кликабельным.
  • getCursor()    - возвращет строку, параметр курсор.
  • getDraggable() - возвращает логическое значение, разрешено ли перетаскивание маркера.
  • getFlat() - возвращает логическое значение, скрывать тень маркера или нет.
  • getIcon() - возвращает строку или MarkerImage-объект изображения маркера.
  • getMap() - вернет Map-объект или StreetViewPanorama-объект, которому принадлежит маркер.
  • getPosition() - вернет координаты (LatLng-объект) позиции маркера.
  • getShadow() - вернет строку или MarkerImage-объект изображения тени.
  • getShape() - вернет MarkerShape-объект активной зоны маркера.
  • getTitle() - вернет строку, надпись маркера.
  • getVisible() - вернет логическое значение, отображен ли маркер.
  • getZIndex() - вернет число (zIndex), расположение маркера относительно остальных объектов по оси Z.
  • setAnimation(animation:Animation) - Начать анимацию. Любые текущие анимации будут отключены. Сейчас поддерживаются анимации: BOUNCE, DROP. При передаче аргументом значения null анимация будет отключена.
  • setClickable(flag:boolean) - установка флага кликабельности маркера.
  • setCursor(cursor:string) - установка курсора для маркера.
  • setDraggable(flag:boolean) - установка флага разрешающего смещение маркера.
  • setFlat(flag:boolean) - установка флага отвечающего за скрытие тени маркера.
  • setIcon(icon:string|MarkerImage) - установка изображения для маркера.
  • setMap(map:Map) - указывает какой карте принадлежит маркер для отображения. Если значение указывается null, то маркер удаляется с карты.
  • setOptions(options:CircleOptions) - устанавливает параметры маркера.
  • setPosition(latlng:LatLng) - устанавливает нувые координаты для маркера.
  • setShadow(shadow:string|MarkerImage) - устанавливает изображение тени.
  • setShape(shape:MarkerShape) - устанавливает активный регион для маркера.
  • setTitle(title:string) - устанавливает заголовок для маркера.
  • setVisible(visible:boolean) - скрывает или показывает окружность на соответсвующей карте (параметр map).
  • setZIndex(zIndex:number) - устанавливает число (zIndex), расположения маркера относительно остальных объектов по оси Z.

Google Maps API 3 дает возможность указать следующие событий для маркера:

  • animation_changed() - событие возникает при изменении анимации.
  • click(MouseEvent) - событие возникает при щелчке курсором по маркеру.
  • clickable_changed() - событие возникает при изменении флага кликабельности.
  • cursor_changed() - событие возникает при изменении курсора маркера.
  • dblclick(MouseEvent) - событие возникает при двойном щелчке курсором по маркеру.
  • drag(MouseEvent) - событие возникает, когда пользователь переместил маркер.
  • dragend(MouseEvent) - событие возникает, когда пользователь закончил перемещать маркер.
  • draggable_changed() - событие возникает при изменении свойст маркера при перемещении.
  • dragstart(MouseEvent) - событие возникает, когда пользователь начинает перемещать маркер.
  • flat_changed() - событие возникает при изменении флага скрфтия тени маркера.
  • icon_changed() - событие возникает при измении изображения маркера.
  • mousedown(MouseEvent) - событие возникает при нажатии кнопки мыши в момент нахождения курсора над маркером.
  • mouseout(MouseEvent) - событие возникает в случае, когда курсор мыши покинул маркер.
  • mouseover(MouseEvent) - событие возникает в случае, когда курсор мыши был помещен в маркер.
  • mouseup(MouseEvent) - событие возникает при отпускании кнопки мыши в момент нахождения курсора над маркером.
  • position_changed() - событие возникает при изменении позиции маркера.
  • rightclick(MouseEvent) - событие возникает при щелчке правой кнопкой мыши, в момент когда курсор находится над маркером.
  • shadow_changed() - событие возникает, когда изменено изображение тени маркера.
  • shape_changed() - событие возникает, когда изменен активный регион маркера.
  • title_changed() - событие возникает при изменении заголовка маркера.
  • visible_changed() - событие возникает при изменении видимости маркера.
  • zindex_changed() - событие возникает при изменении zIndex-а маркера.