Zh GoogleMap Description/ru: Difference between revisions

From Documentation
Jump to navigation Jump to search
mNo edit summary
mNo edit summary
 
(6 intermediate revisions by the same user not shown)
Line 15: Line 15:


{{Zh_GoogleMap_Description_Path/ru}}
{{Zh_GoogleMap_Description_Path/ru}}
{{Zh_GoogleMap_Description_MapType/ru}}
{{Zh_GoogleMap_Description_InfoBubbleStyle/ru}}
{{Zh_GoogleMap_Description_MapOverrides/ru}}




{{Zh_GoogleMap_Description_Category/ru}}
{{Zh_GoogleMap_Description_Category/ru}}
{{Zh_GoogleMap_Description_Utility/ru}}




Line 24: Line 36:




== See also ==
== См. также  ==
{{Icon_see_also}}[[Zh_GoogleMap_Plugin/ru|Плагин для компонента]]
{{Icon_see_also}}[[Zh_GoogleMap_Plugin/ru|Плагин для компонента]]
{{Icon_see_also}}[[Zh_GoogleMap_Module/ru|Модуль для компонента]]




Line 31: Line 45:
{{Languages|Zh_GoogleMap_Description}}
{{Languages|Zh_GoogleMap_Description}}


[[Category:Zh GoogleMap]]
[[Category:Zh GoogleMap|Description]]

Latest revision as of 09:43, 10 October 2019

Установка

Компонент устанавливается на Joomla! 3.x стандартным способом установки через Extension Manager.


Компонент поддерживает функцию автообновления

Параметры

Настройку производить не надо, т.к. компонент работает на Google Maps JavaScript API V3.

Существует ряд параметров, которые можно настроить на уровне компонента.

Переходим на страницу компонента

Выбираем (меню):

  • Components
  • Zh GoogleMap




Нажимаем кнопку "Options"


При создании новых картографических объектов при открытии карты автоматически вычисляется местоположение, если вычислить не удается, то выводится центр Дворцовой площади Санкт-Петербурга (если не установлено место по умолчанию).

Место по умолчанию

Вы можете установить широту и долготу для места по умолчанию на Странице параметров

После чего, когда Вы создаете новую карту, метку, путь через административную панель, местоположение метки на карте будет установлено по умолчанию.


Ключ для Google Earth API

Если Вы хотите использовать функциональность Google Earth, то необходимо получить ключ для Google Earth API и ввести его в параметры.

Не смотря на то, что использовать Earth API можно без ключа, на текущий момент вы должны его указывать, т.к. я пока не смог добиться работы Maps и Earth API вместе и без ключа. Когда я смогу - я исправлю код и вы будете иметь возможность использовать Earth API без ключа API


Ключ для Google Maps API

Если вы хотите использовать ключ Google Maps API для мониторинга или оплаты пользования сверх установленных лимитов, вы можете получить ключ для Google Maps API и ввести его на Странице параметров (аналогично ключу Google Earth API)

Режим совместимости

В некоторых случаях, когда для карты разрешено Управление метками через список групп, Вы можете получить сообщение об ошибке
link.hasClass is not a function

Это может быть связано с конфликтом JQuery и mootools в некоторых шаблонах, или бибилиотека mootools отключена в joomla
В этом случае Вы можете установить режим совместимости, при котором вызовы методов hasClass и toggleClass изменяются на вызовы JavaScript функций, реализующих похожую логику.



Режим совместимости для файлов ресурсов

В некоторых случаях вы ограничиваете доступ к папке administrator. В этой папке для компонента по умолчанию есть папка assets, которая содержит иконки, css-файлы для компонента и плагина.

Если вы блокируете доступ к ней, то при попытке пользователей увидеть карту будет выведено окно логина.

И вот для этого случая в компоненте предусмотрена опция Compatible Mode for Resource Files.

Просто установите значение в ДА, и все ссылки в документе, который содержит карту (вызванную как через компонент, так и через плагин), будут на папку site assets. Не перемещайте файлы и папки, просто используйте их.

И вы должны скопировать иконки из administrator папки (/administrator/components/com_zhgooglemap/assets/icons) в site папку (/components/com_zhgooglemap/assets/icons), т.к. изначально она пустая (потому что если site папка будет содержать иконки, то размер расширения увеличится в два раза)

Если вы хотите использовать свои иконки для меток, вам следует их скопировать в обе папки. В папке administrator иконки будут использоваться в backend (административная панель), для отображения - из папки site.

Протокол

Вы можете установить протокол для загрузки карты


Тип инициализации карты

В некоторых случаях ваш шаблон или другие расширения могут использовать onload функцию. И в таком случае карта не будет инициализирована (выведена), поэтому надо использовать тип domready.


Версия Google Maps API

По умолчанию (пустое значение) используется последняя экспериментальная версия API карт.

Вы можете загрузить определенную версию API. Узнайте больше версиях Google Maps API


Тип карты в редакторе

Вы можете управлять какие типы карт будут доступны когда вы создаете объекты на карте (карту, метки...) и в подробностях отображается карта.

Список категорий

Вы можете определить тип списка категорий, которые будет доступен в подробностях Simple (плоский) или Default (иерархический)

HTML тег для заголовка всплывающего информационного окна

МОжно определить h2 (h3...) тег для всплывающего инфомрационного окна, например, для метки.


powered by

Вы можете определить место вывода моего логотипа, или скрыть его


Создание карты

Переходим на закладку "Maps".



Вводим необходимое количество карт с нужной нам конфигурацией.

Координаты удобно выбирать путем перетаскивания метки (значения автоматически подставляются в поля формы) или кликая мышкой на необходимом месте.


Свойства карты


Title Наименование карты
Description Примечание
Latitude Широта центра карты
Longitude Долгота центра карты


Подробности карты

Show Title as Placemark Выводить наименование карты как метку
  • No - Не выводить метку
  • Drop - Метка с анимацией (Падающая)
  • Bounce - Метка с анимацией (Прыгающая)
  • Simple - Метка без анимации
Open InfoWin Сразу открыть всплывающее окно
Disable AutoPan Отключить автоматическое изменение центра карты при выводе информационного окна
Width Ширина карты,

если ввести 0, то карта откроется на всю доступную ширину области (100%)

Height Высота карты

если ввести 0, то карта откроется на всю доступную высоту области (100%).
Если вы определите Zh Template Map FullScreen для вашей страницы с картой,то карта откроется в полноэкранном режиме. Или вы можете использовтаь данное свойство в других целях

Map Bounds Границы карты, обеспечивают ограничение навигации только в пределах заданной области

Значения вводятся по следующему формату Latitude1,Longitude1;Latitude2,Longitude2
т.е. пара координат разделена точкой с запятой, сами же координаты разделены запятой
Первая координата - левый нижний угол, вторая - правый верхний

Zoom Начальный Масштаб карты
Min Zoom Минимальный масштаб карты
Max Zoom Максимальный масштаб карты
Draggable Разрешает/запрещает перемещение карты
Map Type Начальный Тип карты
  • Roadmap
  • Satellite
  • Hybrid
  • Terrain
  • OpenStreetMap
  • NZTopomaps
  • First Custom Map Type
Google Earth Разрешить переход на Google Планета Земля
  • No
  • Yes
  • Yes (Notify)
OpenStreetMap Layer Разрешить отображать слой 'OpenStreetMap' и возможность перехода на него с помощью переключения типа карт
NZTopomaps Layer Разрешить отображать слой 'NZTopomaps' и возможность перехода на него с помощью переключения типа карт
Allow Custom Map Types Разрешить использование пользовательских типов карт и возможность переключения типа карт
Custom Map Types List Список идентификаторов пользовательских типов карт, разделитель;

Например: 1;2;5
Если вы установите Map Type в First Custom Map Type, то первый идентификатор будет типом карты по умолчанию

Weather Layer Слой погоды, для вывода на карте
KML Layer URL адрес слоя KML, для вывода на карте
Language Язык, на котором отображаются наименования объектов на карте

Например: ru-RU

Show placemark creation information Выводить информацию о создании метки.

Вы можете вывести информацию о пользователе и дате создания метки

  • No
  • Username
  • Date of creation
  • Date of creation and Username
  • Username (after toolbar)
  • Date of creation (after toolbar)
  • Date of creation and Username (after toolbar)
Category Категория, к которой относится карта

Использование Google Планета Земля

Переходим к опциям компонента.

Вводим полученный ключ Google Earth API.

На закладке "Map" для необходимой карты выбираем использование Google Earth

  • "Yes" - карта отображается, но если на компьютере не установлен плагин Google Earth Plugin, то функциональность не доступна
  • "Yes (Notify)" - карта отображается, но если на компьютере не установлен плагин Google Earth Plugin, то функциональность не доступна и выводится сообщение об отсутствии плагина



Использование KML файлов

Если имеется KML-файл, вы можете расположить его в доступной папке на сайте и указать адрес в поле KML Layer.

Если же вы хотите использовать более одного файла, вы можете воспользоваться "featute", а именно поле путь (path) на закладке пути(Paths) необязательное.

  • переходим на закладку Paths
  • создаем путь
  • указываем поле KML Layer

И после этого новый файл будет выведен

Верхний колонтитул карты

Header HTML-text HTML текст над картой
Show Header Separator Отображать верхний разделитель


Нижний колонтитул карты

Show Footer Separator Отображать нижний разделитель
Footer HTML-text HTML текст под картой


Стили

Styles Стили для карты

См. о стилях Start Styling your Map

Конструктор стилей Google Maps API Styled Map Wizard
Просто нажмите кнопку Finish, скопируйте код между [ и ] включая их, и поместите в это поле

Элементы управления картой

Существует 3 секции в данном разделе


Первая секция


Map Type Control Элемент управления переключением типа карты
Pan Control Элемент управления перемещением
Zoom Control Вывод элемента управления масштабом
Scale Control Вывод шкалы масштабирования
Overview Map Control Вывод обзорной карты
  • Yes
  • No
  • Yes (Open) - открыть обзорную карту
Double Click Zoom Возможность масштабирования по двойному щелчку мыши
Scroll Wheel Zoom Возможность масштабирования колёсиком мыши
Rotate Control Вывод элемента управления поворотом
Street View Control Вывод элемента управления обзором улиц
Traffic Layer Вывод слоя 'Пробки'
Bicycle Layer Вывод слоя 'Велосипед'
Home Button Возможность возврата к первоначальному центру карты и/или масштабу


Вторая секция

]

Find Control (geocoding) Вывод элемента управления поиск через геокодирование
Find Control width Ширина поля ввода адреса для поиска
Draw route from search point to place Разрешить построение маршрута от найденного адреса до места
Изменить масштаб для результата Вы можете изменить масштаб при получении результата поиска
Search region Region Localization: если Вы хотите изменить местоположение для его использования геокодером и указать конкретный регион.
The value is Unicode region subtag identifiers. Most Unicode region identifiers are identical to ISO 3166-1 codes, with some notable exceptions. E.g., US, ES. But as for example for Great Britain is GB, not UK


Третья секция


Map Type Control Расположение элемента на карте
Pan Control Расположение элемента на карте
Zoom Control Расположение элемента на карте
Scale Control Расположение элемента на карте
Street View Control Расположение элемента на карте
Find Control (geocoding) Расположение элемента на карте
Geolocation Control Расположение элемента на карте
Placemark List Button Расположение элемента на карте
Traffic Layer Button Расположение элемента на карте
Transit Layer Button Расположение элемента на карте
Bicycle Layer Button Расположение элемента на карте
Home Button Расположение элемента на карте

Свойства карты для меток

Placemark ordering Сортировка меток, это удобно при выводе их в списке меток
  • Placemark title
  • Category title and ordering
  • Category title (descending) and ordering
  • User ordering index
  • Group title and Placemark title
  • Group title (descending) and Placemark title
  • Group user ordering index and Placemark title
  • Group user ordering index (descending) and Placemark title
  • Date of creation
  • Date of creation (descending)
Show placemarks in cluster Создавать кластер для маркеров
Marker Cluster Zoom Level Масштаб, с которого начинается кластеризация (метки начинают группироваться)
Group Placemarks in Cluster by Group Property Создавать кластер для каждой группы маркеров (также можно изменить иконку на кластере)
Необходимо помнить, что если используется данная функциональность (без использования управления метками через группу), то у группы должен быть указан признак активности в кластере (признак Active in Group List)
Place overlapping placemarks on a spiral Включить опцию вывода перекрывающихся меток на спирали
Show placemark hover text Включить опцию вывода всплывающего окна (InfoWin/InfoBubble) при наведении на метку
  • No
  • Open InfoWin
  • Open InfoBubble
InfoBubble Style Если вы используете Open InfoBubble для опции Show placemark hover text вы можете определить стиль для InfoBubble

Свойства карты для Списка Меток

Width Ширина списка меток в px

Если установить в 0 то вы получите 100% ширины.
Это удобно, если список расположен под картой, и при этом карта занимакет 100% ширины контейнера

Height Высота списка меток в px
Position Местоположение, допустимые значения
  • No - список не выводится
  • ... - слой над картой
  • Left и Right - табличный вид
  • List-Map и Map-List - div-вид
  • External - вы можете расположить тег ul с id=GMapsMarkerUL в любое место для указания места вывода списка меток в указанное место

Например,

<ul id="GMapsMarkerUL" style="list-style-type: none;"></ul>
Style Стиль, допустимые значения
  • Simple - предопределен в CSS-файле
  • Advanced - предопределен в CSS-файле
  • External - вы можете определить его в вашем шаблоне
Background Color Цвет фона

Например: #EAEAEA

Что касается градиента в моем примере, я нашел его на сайтах. Когда вы указываете цвет фона #E6E6E6, в стили я добавляю следующий фрагмент

background: #E6E6E6

Я взял вот этот пример

background: #fefcea; /* For old browsers */
    background: -moz-linear-gradient(top, #fefcea, #f1da36); /* Firefox 3.6+ */
    /* Chrome 1-9, Safari 4-5 */
    background: -webkit-gradient(linear, left top, left bottom, 
                color-stop(0%,#fefcea), color-stop(100%,#f1da36));
    /* Chrome 10+, Safari 5.1+ */
    background: -webkit-linear-gradient(top, #fefcea, #f1da36);
    background: -o-linear-gradient(top, #fefcea, #f1da36); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #fefcea, #f1da36); /* IE10 */
    background: linear-gradient(top, #fefcea, #f1da36); /* CSS3 */ 
    padding: 10px;
    border: 1px solid #333;


Я не знаю, правильный ли он, и на все ли случаи жизни он подойдет. Но, для примера, почему бы и нет. Я изменил начальный и конечный цвета на свои. И первый background: мы не должны вводить, так как я его сам создаю.

После всех переделок мой код получился следующий

#E6E6E6; /* For old browsers */
     background: -moz-linear-gradient(top, #E6E6E6, #AAAAAA); /* Firefox 3.6+ */
     /* Chrome 1-9, Safari 4-5 */
     background: -webkit-gradient(linear, left top, left bottom,
                  color-stop(0%,#E6E6E6), color-stop(100%,#AAAAAA));
     /* Chrome 10+, Safari 5.1+ */
     background: -webkit-linear-gradient(top, #E6E6E6, #AAAAAA);
     background: -o-linear-gradient(top, #E6E6E6, #AAAAAA); /* Opera 11.10+ */
     background: -ms-linear-gradient(top, #E6E6E6, #AAAAAA); /* IE10 */
     background: linear-gradient(top, #E6E6E6, #AAAAAA); /* CSS3 */
     padding: 10px;
     border: 1px solid #333;

Я заметил, что в IE9 градиента нет. Но это не стояло задачей в моем компоненте сделать это через CSS. В любом случае вы можете сделать это через изображение и класс.

Action by Click Действие при клике на ссылке
  • Center - центрировать карту на метке
  • Click - выполнить клик на метке
  • Center, Animate - центрировать карту на метке и анимировать иконку метки
  • Click, Animate - выполнить клик на метке и анимировать иконку метки
  • Center, Animate and Click - центрировать карту на метке, анимировать иконку метки и выполнить клик на метке
Placemark List Content Текст. который содержится в списке меток
  • Title - наименование метки
  • Title and Description - наименование метки и примечание
  • Title and Addition HTML text - наименование метки и дополнительный HTML текст
  • Icon and Title - иконка метки и наименование
  • Icon, Title and Description
  • Icon, Title and Addition HTML text - иконка метки, наименование и дополнительный HTML текст
  • Icon, Title and Description (table) - табличный вид
  • Icon, Title and Addition HTML text (table) - табличный вид
  • Title and Image - наименование метки и изображение (миниатюра)
  • Title, Image and Description
  • Title, Image and Addition HTML text
  • Image and Title
  • Image, Title and Description
  • Image, Title and Addition HTML text
  • Image, Title and Description (table) - табличный вид
  • Image, Title and Addition HTML text (table) - табличный вид
  • Table: Title - наименование метки и табличный вид
  • Table: Title and Description - наименование метки и примечание и табличный вид
  • Table: Title and Addition HTML text - наименование метки и дополниткльный HTML текст и табличный вид
Appearance Внешний вид списка меток
  • Open List - Список меток сразу открыт
  • Icon Button - дополнительная кнопка (иконка) на карте
  • Text Button - дополнительная кнопка (текст) на карте
  • Icon Button and Open List - дополнительная кнопка (иконка) на карте и список меток сразу открыт
  • Text Button and Open List - дополнительная кнопка (текст) на карте и список меток сразу открыт
Search placemark field Дополнительная опция поиска меток в списке с автодополнением

Группы

Placemark Group Control Расположение и тип списка групп, который будет отображен для управления маркерами
  • No - управление через список групп отключено
  • Left - Список групп слева (табличный стиль)
  • Right - Список групп справа (табличный стиль)
  • Top - Список групп наверху (табличный стиль)
  • Bottom - Список групп внизу (табличный стиль)
  • Group-Map - Список групп наверху (div стиль)
  • Map-Group - Список групп внизу (div стиль)
Placemark Group Type Поведение списка групп
  • Toggle Group
  • Only One Active Group
Manage Placemarks Опция разрешает управлять метками через список
Synchronize with placemark list Выводить/скрывать метки в списке меток в зависимости от статуса группы
Manage Paths Опция разрешает управлять путями через список групп
Group ordering Сортировка групп в списке
  • Group title
  • Category Title and ordering
  • User ordering index
Placemark Group Column Width Ширина колонки списка групп при расположении слева или справа от карты
Show Placemark Group Вывести текст, иконку группы в списке групп
  • Text
  • Icon
  • Text and Icon
Search group field Вывести поле поиска групп в списке групп
Display Show All and Hide All buttons Выводить кнопки показать/скрыть все группы в один клик
  • No
  • Text
  • Icon
  • Text and Icon
Group CSS Тип оформления группы

Существует два предопределенных стиля в

/administrator/components/com_zhgooglemap/assets/css/markergroups.css

и один (external) – для возможности установки стилей вами в вашем шаблоне. Идентификаторы (ID) для тэгов зависят от значения поля Placemark Group CSS. Подробнее смотрите Группировка маркеров

Group List Title Заголовок списка групп
Top Description Примечание над списком
Show Top-Separator Выводить разделитель над списком
Show Bottom-Separator Выводить разделитель под списком
Bottom Description Примечание под списком

Маршрут

Эта опция необходима если Вы используете поиск для нахождения определенного места

  • с помощью поиска через геокодирование (слайдер Map Find Control (geocoding))
  • с помощью поля автозаполнения (слайдер Places Library)


Draggable Возможность изменения построенного маршрута
Show Route Panel Возможность вывода подробностей маршрута
Address Если вы не хотите использовать координаты центра карты как место назначения при построении маршрута (например, Google не совсем правильно переводит координаты в текстовый адрес), вы можете ввести в это поле текстовое значение адреса и он будет использован при построении маршрута

Используйте значение из поля автозаполнения (скопируйте его) для более верного задания адреса для google router

Travel Mode: Driving Возможность вывода данного типа передвижения
Travel Mode: Walking Возможность вывода данного типа передвижения
Travel Mode: Bicycling Возможность вывода данного типа передвижения Unit System Измерение расстояний
Avoid Highways Избегать автомагистрали
Avoid Tolls Избегать платных дорог

Использование Places Library

Enable using Places Возможность использования Places Library
Places Types Типы мест, указываются в одинарных кавычках, разделенных запятой

например: 'restaurant', 'store'
Google Places API: Поддерживаемые типы мест

Radius Радиус от центра карты (в метрах).

Если Вы не хотите видеть метки, созданные Places API, а хотите только пользоваться полем автозаполнения, укажите радиус равным 0
Places API выводит только до 20 мест!

Show Autocomplete field Возможность использования поля автозаполнения
Places Types for Autocomplete field Типы мест для поля автозаполнения, аналогично типам мест, указываются в одинарных кавычках, разделенных запятой


значение может быть либо 'establishment' либо 'geocode', соответствующие фирмам или адресам соответственно. Если не указано ни одного, то используются оба.

Show direction Вывести маршрут(с помощью Directions API) от места, которое вы нашли с помощью поля автозаполнения (где стоит метка) и меткой на карте (которая установлена на карте, центр карты)
Search country Country Localization: если Вы хотите ограничить поле автодополнения только значениями какой-либо одной страны.
The value is ISO 3166-1 Alpha-2 country code. E.g., US, BR, AU.

Использование Panoramio Library


Дополнительные параметры

Loading map objects dynamically Опция позволяет динамически загружать метки с помощью AJAX
  • No
  • JQuery
  • Mootools
Load type Тип загрузки меток, т.е. загружать их всех или по каким-то критериям
  • All
  • All (two steps: use map bounds, all the rest)
  • Use map bounds
Buffer size for placemarks Вы можете загружать метки частями
Loading content data dynamically Опция позволяет динамически загружать содержимое метки с помощью AJAX
  • No
  • JQuery
  • Mootools

Т.е. ваша страница содержит код создания меток, но содержимое всплывающих окон загружается динамически.
Если метки загружаются с помощью AJAX, то и их содержимое загружается также динамически.


MarkerManager Возможность использования Marker Manager

Marker Manager выводит метки при определенном масштабе.

Elevation Возможность использования Elevation API

Выводить уровень местности в точке клика мышкой.

Street View Возможность отображения панорам улиц(Street View)
  • No
  • Top - панорама располагается над картой
  • Bottom - панорама располагается под картой
Street View Style Стиль панорамы улиц
  • Default - по умолчанию
Placemark Filter Ограничение вывода меток на основании правил.
Allow to user enter placemarks Разрешение создания меток зарегистрированными пользователями.
Insert Allowed Пользователю разрешено создание меток
Update Allowed Пользователю разрешено изменение меток
Delete Allowed Пользователю разрешено удаление меток
New Placemark State Статус для новой пользовательской метки.
New Contact State Статус для нового пользовательского контакта (если включена интеграция с контактами).
Show Icon Type Selector for New Placemark Возможность выбора иконки при создании пользовательских меток.
CSS Class Наименование класса для div секции карты
Additional CSS styles for loading Список файлов стилей CSS для загрузки при отображении карты, разделенных либо точкой с запятой, либо с новой строки
Additional JavaScript files for loading Список JavaScript файлов для загрузки при отображении карты, разделенных либо точкой с запятой, либо с новой строки
Placemark Rating Разрешает использовать систему рейтинга для меток.
  • No
  • JQuery
  • Mootools
Map text override Вы можете использовать данную функциональность для переопределения стандартного текста для элементов управления и т.п. через специальный интерфейс в компоненте в административной панели.

Автоматическое позиционирование

Auto Positioning Автоматическое позиционирование при отображении карты
Geolocation Control Отображение кнопки геопозиционирования
Geolocation Button Style Стиль кнопки геопозиционирования
  • Icon
  • Text
  • Icon and Text


Интеграция

Use contacts Возможность использование контактов

Вы можете разрешить использование информации из контактов, ассоциировать контакт с меткой и вывести контактную информацию во всплывающем окне.

Contact Details Вы можете определить какие атрибуты контакта выводить. Разделителем является ;

Допустимые значения

  • name
  • position
  • address
  • city
  • suburb
  • state
  • province
  • country
  • postcode
  • zipcode
  • phone
  • mobile
  • fax
  • email
  • website

Вы можете указывать их в том порядке, который вам нужен при выводе.

Примечание: postcode и zipcode – это одно и то же поле но с разным наименованием.

Посмотрите на поля контакта, и Вы увидите пары полей: City or Suburb, State or Province, Postal / ZIP Code


Например: position;name;mobile

выведет должность, наименование контакта и мобильный телефон

Use users Возможность использование информации из профиля пользователя

Вы можете разрешить использование информации из профиля пользователя, ассоциировать пользователя с меткой и вывести информацию во всплывающем окне.

Display

Использование Marker Manager

При использовании Marker Manager существуют ограничения:

  • вы не можете использовать кластеризацию - потому что кластер группирует метки, и сам контролирует их вывод
  • вы не можете использовать управление метками через список групп

Для использования Marker Manager:

  • установите группу на метках
  • установите Min Zoom for Marker Manager и Max Zoom for Marker Manager для каждой группы
  • разрешите использование данной функциональности


Создание меток

Переходим на закладку "Placemarks".

Вводим необходимое количество меток с привязкой к конкретной карте.

Координаты удобно выбирать путем перетаскивания метки (значения автоматически подставляются в поля формы) или кликая мышкой на необходимом месте.

Также вы можете использовать поле автозаполнения над картой.

Или введите текстовый адрес в поле автозаполнения и нажмите кнопку поиска для поиска места через геокодирование.


Свойства метки

Title Наименование метки
Description Примечание
Tags Теги
Latitude Широта
Longitude Долгота
Address Адрес в текстовом виде. У вас есть возможность загрузить данные в это поле если у вас нет данных lat/lng. В этом случае адрес будет автоматически геокодирован и метка выведена. И в backend метка также будет отображена. Но если вы измените положение метки (измените позицию на карте путем перетаскивания или клика мышкой в другом месте), новая позиция будет сохранена в lat/lng формате.

Вывод меток через lat/lng более быстрый, т.к. не требуется геокодирования.

Map Title Наименование карты, на которой выводится метка


Подробности метки

Published Признак публикации, т.е. активности записи
Group Группа
Protected from user correction Запретить редактирование метки, если вы активировали возможность ввода меток пользователями сайта
Include in Placemark List Включить метку в список меток
Category Категория, к которой относится метка
User ordering index Индекс при ручной сортировки меток в списке меток
Rating Рейтинг метки, может быть установлен только через систему рейтинга
Show GPS information Отображать GPS информацию (координаты) в информационном окне
Addition HTML text HTML текст, который будет включен в метку

Будьте внимательны, если вы вводите email адрес, то другой плагин Joomla! его изменит, и в результате возникнет ошибка и карта не будет выведена. В этом случае вы можете скопировать код, который создался в результате работы плагина и вставить его в HTML текст, и в этом случае плагин его не поменяет.

Placemark full description описание метки (HTML текст) в представлении подробностей метки (одиночное представление метки на странице)
Hover HTML text Текст для всплывающего информационного окна при наведении на метку (если данная опция включена)

Внешний вид метки

Icon Type Иконка
Icon X-offset Смещение иконки
Icon Y-offset Смещение иконки
Marker Тип метки
  • No - Метка не выводится
  • Drop - Метка с анимацией (Падающая)
  • Bounce - Метка с анимацией (Прыгающая)
  • Simple - Метка без анимации
  • Infographics Icon: Drop - Метка с анимацией (Падающая) с динамической иконкой
  • Infographics Icon: Bounce - Метка с анимацией (Прыгающая) с динамической иконкой
  • Infographics Icon: Simple - Метка без анимации с динамической иконкой
  • Marker with label: Drop - Метка с анимацией (Падающая) и подписью
  • Marker with label: Bounce - Метка с анимацией (Прыгающая) и подписью
  • Marker with label: Simple - Метка без анимации и с подписью
Open InfoWin Сразу выполнить действие, указанное в Action by Click и Zoom by Click
InfoWin Content Содержимое всплывающего окна
  • Title and Description
  • Title
  • Description
  • Title and Article (by iframe)
  • Article (by iframe)
  • None
Action by Click Действие при клике на метке
  • Open InfoWin
  • Open Link - открывает линк, определенный в поле URL Site
  • Open Link in new page
  • Open InfoBubble
  • Open Street View - открыть просмотр панорам улиц для метки (если опция разрешена в свойствах карты)
  • None
Zoom by Click Масштаб при клике на метке

Вы можете изменить масштаб при клике на метке

  • Do not change - масштаб не изменяется
Street View in InfoWin Возможность вывода кнопки показа Strret View во всплывающем окне
View Area Width for Street View Ширина области показа Street View во всплывающем окне
View Area Height for Street View Высота области показа Street View во всплывающем окне
Street View Style Дополнительные свойства Street View. Их можно создать на отдельной закладке компонента
URL Site URL адрес сайта
Site Name Наименование сайта, которое будет отображаться вместо URL адреса
URL Image URL адрес изображения для отображения в метке
URL Image Thumbnail URL адрес изображения для отображения в списке меток
Start Publishing Дата начала публикации метки
Finish Publishing Дата окончания публикации метки
Date of creation Дата создания метки
Access ACL уровень доступа к метки
Infographics Type Тип динамической иконки

Например: chst=d_fnote&chld=thought|1|0088FF|h|Why+am+I+here?
Дополнительно смотрите об Infographics (Dynamic Icons)

Infographics Icon width Ширина динамической иконки
Infographics Icon height Высота динамической иконки

Метка с подписью

Label Class CSS Class подписи
Label in background Подпись на фоне
Label X-offset Смещение подписи
Label Y-offset Смещение подписи
Label content HTML содержимое подписи

Закладки InfoBubble

О всплывающем информационном окне InfoBubble вы можете прочитать здесь InfoBubble example

Данная библиотека только используется в компоненте. Если она работает не так, как вы ожидаете (есть ошибки) - проверьте на странице примера, и если не работает, то вам следует обращаться на форум google maps или данной библиотеки.


Style Стиль для InfoBubble
Add InfoWin content Добавить InfoWin content (содержимое информационного окна) к InfoBubble
  • No
  • as first tab - добавить содержимое перед всеми закладками
  • as last tab - добавить содержимое после всех закладок
  • replace content - добавить содержимое после вместо закладок, без закладок


Title Наименование закладки
Image Вы можете использовать изображение для построения галереи изображений в представлении вывода одной метки
HTML Text Текст на закладке



Интеграция

User Пользователь, ассоциированный с меткой
Show user prompts Тип представления пользовательской информации
  • No
  • Text
  • Icon
  • No prompts
Contact Контакт, ассоциированный с меткой
Show contact prompts Тип представления контактной информации
  • No
  • Text
  • Icon
  • No prompts
Contact Button in InfoWin toolbar Вывести кнопку контакта в тулбаре информационного окна
Alternative Contact URL Вы можете указать другую URL-ссылку на контакт (вместо стандартного вызова joomla)
Placemark details Button in InfoWin toolbar Вывести кнопку метки в тулбаре информационного окна
Alternative Details URL Вы можете указать другую URL-ссылку на подробностей метки (вместо стандартного вызова страницы представления одной метки)
Placemark Details for standard call Вы можете переопределить атрибуты для вывода в подробном представлении

По умолчанию подробности метки открываются без загрузки библиотеки bootstrap и ее стилей, без эскиза изображения и галереи, также без дополнительных описательных полей "Additional HTML text" и "Placemark full description".

Вы можете изменить поведение по умолчанию путем передачи параметров, разделенных запятой (,)

  • load bootstrap
  • load bootstrap styles
  • thumbnail
  • image gallery
  • addition html text
  • full description

Например, если вы введете image gallery,addition html text,full description в поле, то подробное описание метки будет также включать два дополнительных описания (краткое "Addition HTML text" и полное "Placemark full description"), а также галерею изображений.

Article Статья, ассоциированная с меткой
Article Button in InfoWin toolbar Вывести кнопку статьи в тулбаре информационного окна
Alternative Article URL Вы можете указать другую URL-ссылку на статью (вместо стандартного вызова joomla)
iframe tag Article CSS Вы можете определить стиль CSS для iframe тега (когда используете статью как содержимое всплывающего окна)

Дополнительные поля для пользовательской кастомизации

Если Вам дополнительно нужны поля, которые хотите заполнять через интерфейс, а затем их использовать в своих скриптах, то в разделе дополнительных полей для пользовательской кастомизации Вы можете определить в какое поле будет записываться нужная вам информация.

Для удобства Вы также можете изменить подпись этих полей в файле

/administrator/language/en-GB/en-GB.com_zhgooglemap.ini

lines

COM_ZHGOOGLEMAP_MAPMARKER_DETAIL_ATTRIBUTE1_LABEL 

COM_ZHGOOGLEMAP_MAPMARKER_DETAIL_ATTRIBUTE2_LABEL 

… 

COM_ZHGOOGLEMAP_MAPMARKER_DETAIL_ATTRIBUTE9_LABEL


Например, вы можете ввести некоторую информацию в эти поля.

В таблице наименование этих столбцов

attribute1

attribute2
...

attribute9


Вы можете использовать эти поля, например, для интеграции с другими системами, и т.д.


Display


Кастомизация меток

Скопируйте свои изображения меток (в формате PNG) в каталог

/administrator/components/com_zhgooglemap/assets/icons/

Компонент автоматически подхватит изображения при выборе типа метки.

Единственное требование – чтобы расширение файла было .png т.е. в нижнем регистре, т.к. наименования изображений хранятся в БД без расширения, и оно дописывается при выводе.

И не забудьте о Режиме совместимости для файлов ресурсов

Группировка меток

Метка может входить в одну из групп, для этого на метке указываете принадлежность к группе.

Если на карте установлен признак использования группировки меток (значение поля Placemark Control отлично от No), то начинает работать дополнительная функциональность: появляется список активных групп (местоположение определяется этим же полем, причем первые четыре (left, top, right, bottom) соответствуют табличной форме представления, а два последний (Group-Map, Map-Group) – строится на div, и у Вас есть возможность делать с ними что угодно.

На карте также есть выпадающий список Placemark Group CSS – который реализует следующую функциональность:

  • первые два стиля – предопределенные, и находятся в файле в папке
  • третий – Вы его можете переопределить в своем css-файле шаблона
  • при этом в этих трех случаях просто имеем три разных названия объектов, соответственно, можно изменять стили как вздумается.


Наименования следующие

для div-тега идентификатор принимает значения

  • GMapsMenu-advanced
  • GMapsMenu-simple
  • GMapsMenu-external

для ul-тега

  • zhgm-menu-advanced
  • zhgm-menu-simple
  • zhgm-menu-external

Соответственно, стили прописываем для них.

Поле Show Placemark Group Icon на закладке "Maps" используется для отображения иконки группы в списке групп.


Создание групп

Переходим на закладку "Placemark Groups".

Вводим необходимое количество групп.


Свойства группы

Title Наименование группы
Description Примечание
Published Признак публикации, т.е. активности записи
Icon Type Иконка группы (можно использовать свои, т.к. механизм тот же)
Icon X-offset Смещение иконки
Icon Y-offset Смещение иконки
Override Placemark Icon Изменить иконку метки на иконку группы
Override Cluster Icon Изменить иконку на кластере, если создается кластер для каждой группы
Active in Placemark Group List Установка группы в активное состояние (выводятся маркеры) когда выводится страница.
Параметр имеет двойное назначение: вывод маркеров при создании кластеров для каждой группы, либо вывод маркеров при управлении через группу и установка данной группы активной в списке
Min Zoom for Marker Manager Масштаб, начиная с которого метки будут выводиться Marker Manager
Max Zoom for Marker Manager Масштаб, после которого метки перестанут выводиться Marker Manager
Category Категория, к которой относится группа
User ordering index Данное поле можно использовать для ручной сортировки групп в списке групп


Display


Создание маршрутов

Под маршрутом понимается автоматическая прокладка маршрута между ключевыми точками (данная функциональность присутствует в API как Directions API).

Переходим на закладку "Routes".

Вводим необходимое количество маршрутов с привязкой к конкретной карте.

Поле Route - маршрут, вводится каждая точка маршрута в двойных кавычках ("), разделителем между точками является точка с запятой (;)


Свойства маршрута


Title Наименование маршрута
Description Примечание
Addition HTML text Дополнительный текст в формате HTML
Published Признак публикации, т.е. активности записи
Travel Mode Способ передвижения
Unit System Измерение расстояний
Route Маршрут - значения промежуточных точек - текстовое значение адреса в двойных кавычках ("), разделение между точками - точка с запятой (;)

например: "Арбатская";"Кропоткинская"; "Москва, проспект Мира 20";"Москва, Петровка 10"

Route by Placemarks Маршрут, заданный идентификаторами меток, разделенными точкой с запятой (;)

например: 1;2;4;6
Вы должны использовать метки, заданные широтой и долготой, а не текстовым значением адреса (использование геокодирования при выводе такой метки)

Provide Route Alternatives Предоставление альтернативных маршрутов.
Avoid Highways Избегать автомагистрали
Avoid Tolls Избегать платных дорог
Optimize Waypoints Оптимизировать путевые точки.
Show Type Поведение границ карты при выводе маршрута
  • Zoom - Производится масштабирование для отображения всего маршрута
  • Unchange - Границы не изменяются
Draggable Разрешить изменение пользователем маршрута
Weight Толщина линии маршрута
Color Цвел линии маршрута
Opacity Прозрачность линии маршрута
Show Panel Выводить подробности маршрута (дистанции и т.п.)
Show total distance Выводить общую протяженность маршрута
Show description Выводить описание и дополнительный HTML текст под картой
Suppress Markers Подавляет вывод меток, которые создаются для начальной точки машрута, конечной и промежуточных
Map Title Наименование карты, на которой выводится маршрут
Category Категория, к которой относится маршрут

Display


Прокладывание пути

Под путем понимается произвольная ломаная линия.

Переходим на закладку "Paths".


Вводим необходимое количество путей с привязкой к конкретной карте.

Координаты удобно выбирать путем перетаскивания метки (значения подставляются в справочное поле формы Current coordinates, оттуда можно скопировать и добавить через разделитель в поле Path) или кликая мышкой на необходимом месте.

Поле Path - набор координат точек, координаты отделены между собой запятой (,), сами точки – через точку с запятой(;)


Во второй части будет показано, как можно рисовать ломаную линию с использованием дополнительных инструментов и получать значения для заполнения поля Path.


Свойства пути


Title Наименование пути
Description Примечание
Path Путь

например: 59.92335689062723,30.385787878185525;59.92374467628344,30.387547407299284

Object Type Линия или область
Map Title Наименование карты, на которой выводится путь
Category Категория, к которой относится путь
Current coordinates Текущие координаты метки


Подробности пути


Addition HTML text HTML текст, который будет включен во всплывающее окно

Будьте внимательны, если вы вводите email адрес, то другой плагин Joomla! его изменит, и в результате возникнет ошибка и карта не будет выведена. В этом случае вы можете скопировать код, который создался в результате работы плагина и вставить его в HTML текст, и в этом случае плагин его не поменяет.

Published Признак публикации, т.е. активности записи
Geodesic line Создается геодезическая линия (дуга)
Weight Толщина линии
Color Цвет линии
например: #FF0000
Opacity Прозрачность, дробное число от 0 до 1
Fill Color Цвет заполнения области (прямоугольника, круга)
например: #FF0000
Fill Opacity Прозрачность области, дробное число от 0 до 1
Radius Радиус окружности в метрах
Group Группа, которая может быть использована при управлении метками(путями) через список групп
Category Категория, к которой относится путь

Дополнительные параметры


InfoWin Content Содержимое всплывающего информационного окна
  • No
  • Title
  • Description
  • Title and Description
KML Layer Show Type Поведение границ карты для отображения слоя
  • Zoom - изменить масштаб для полного отображения слоя
  • Unchange - не изменять границы карты
Action by Click Действие при клике на слое
  • No
  • Open InfoWin

KML Слой

KML Layer URL адрес слоя KML, для вывода на карте
KML Layer Show Type Поведение границ карты при выводе KML слоя
  • Zoom - Производится масштабирование для отображения всего слоя
  • Unchange - Границы не изменяются
Suppress InfoWin Подавлять открытие всплывающего окна при клике на слое

Диаграммы высот

Elevation Включает опцию рисования диаграммы высот
Diagram Width Ширина диаграммы
Diagram Height Высота диаграммы
Samples count Количество значений на диаграмме
Samples count (KML) Количество значений из KML файла (при выводе диаграммы на основании файла)
Icon Type Вид иконки для отображения на карте текущей позиции на диаграмме
Baseline Значение основной линии
Baseline Color Цвет основной линии
Gridline Color Цвет вспомогательных линий
Gridline Count Количество вспомогательных линий
Minor Gridline Color Цвет малых вспомогательных линий
Minor Gridline Count Количество малых вспомогательных линий
Min Value Минимальное значение
Max Value Максимальное значение
Background Border Color Цвет границы
Background Border Width Ширина границы
Background Fill Color Цвет заполнения фона

Display


Создание пути с помощью средства рисования

Добавлена новая возможность - инструмент рисования

На карте теперь есть дополнительные элементы управления


Вы просто рисуете ломаную линию путём кликания мышью в необходимых точках. Двойной клик останавливает рисование.

Как только вы закончили рисовать, поле Path содержит все необходимые координаты для построения пути.

Если вам надо получить координаты точки на карте, просто кликнете на ней не в режиме рисования, и поле Current coordinates будет содержать их



Google's Drawing Library не поддерживает создание ломаной линии на основании предопределенных точек, поэтому компонент не выводит инструмент рисования в случае сохранения пути, в этом случае выводится путь как редактируемая ломаная линия для более удобного использования. Вы можете изменять ее, или напрямую редактировать координаты. Чтобы удалить такую линию - очистите поле координат и сохраните изменения, в данном случае опять выведется инструмент рисования.


Создание типов карт

Под типом карт понимается пользовательский тип карт для получения тайлов карты.

Переходим на закладку "Map Types".

Вводим необходимое количество типов карт.

См. также: Google Maps JavaScript API v3 - Custom Map Types

Свойства Типа Карт

Title Наименование типа карты
Description Описание
Min Zoom Минимальный масштаб карты (для которого существуют тайлы)
Max Zoom Максимальный масштаб карты (для которого существуют тайлы)
is PNG Тип изображения для тайлов
Tile Width Ширина тайла
Tile Height Высота тайла
Get Tile URL function Функция для получения URL тайла
Opacity Прозрачность
Layer Type Тип слоя для карты
  • Map - Basemap
  • Overlay - Overlay
Published Признак публикации
Category Категория к которой принадлежит тип карты

См. также: Урок создания пользовательского типа карты

Определение Проекции

Это дополнительный раздел вы можете использовать для создания своих проекций.

Рассмотрим, как создать свой тип карты с проекцией

Все поля - это текстовые поля, и для их понимания лучше обратиться к упражнению Урок создания пользовательского типа карты


См. также: Урок создания пользовательского типа карты


Display


Создание стиля для всплывающего окна с закладками (InfoBubble)

О всплывающем окне с закладками (InfoBubbles) смотрите на странице InfoBubble

Переходим на закладку "InfoBubbles Styles".

Вводим необходимое количество стилей для InfoBubble.

Свойства стиля всплывающего окна

Title Наименование стиля
Description Описание
Shadow Style Тень
Padding Отступы
Border Radius Радиус границы
Border Width Ширина границы
Border Color Цвет границы

Например: #000000

Background Color Цвет фона

Например: #EAEAEA

Min Width Минимальная ширина (px)
Max Width Максимальная ширина (px)
Min Height Минимальная высота (px)
Max Height Максимальная высота (px)
Arrow Size Размер указателя (px)
Arrow Position Положение указателя (%)
Arrow Style Стиль указателя
Disable Auto Pan Отключить автоматическое изменение позиции для полного отображения
Hide Close Button Скрыть кнопку закрытия
Background Class Name Наименование класса для фона
Published Признак публикации
Category Категория, к которой принадлежит стиль для Infobubble


См. также Урок создания InfoBubble

Display


Создание переопределения карты

Это свойство позволит вам переопределить статический текст для объектов карты.

Вы можете определить переопределение и использовать его путем назначения в подробностях карты.

Переопределение описания карты

Title Наименование
Description Описание
Published Признак публикации
Category Категория, к которой принадлежит переопределение


Список меток

В данном разделе вы можете переопределить текст для объектов, относящихся к списку меток.

Button title Наименование кнопки списка меток
Button tooltip text Всплывающая подсказка для кнопки списка меток
Placeholder text: Search Вы можете переопределить текст Поиск в поле для поиска в списке меток

Display


Создание стиля StreetView

Переходим на закладку "StreetView Styles".

Вводим необходимое количество стилей Street View.

StreetView Style Details


Title Наименование стиля
Description Описание
Published Признак публикации
Heading Heading
Pitch Pitch
Zoom Zoom
Category Категория, к которой принадлежит стиль для StreetView


Publishing Options


Start Publishing Дата начала публикации
Finish Publishing Дата окончания публикации

Display


Созданрие типов описания погоды (Weather Type)


Создание рекламы (AdSense)


Настройка категорий

Можно перейти на закладку "Categories" и ввести категории для компонента.

Потом можно пройтись по объектам карты и пометить их категорией.

На основании категорий можно будет дополнительно каким-либо образом расширить функциональность компонента.


Утилиты

Загрузка CSV

Отображение карты

Существует несколько типов пунктов меню

Первый тип меню - это карта.

Он отображает заранее сконфигурированную карту. У вас есть возможность переопределить ряд параметров карты.

Создайте пункт меню и выбирите тип Zh GoogleMap - Map.

Выберите необходимую карту.

Если вы не измените другие поля - вы получите карту такую, как вы ее определили изначально.

Для списков вы должны вводить идентификаторы через точку с запятой в качестве разделителя

Map Title Карта для отображения
Zoom Масштаб карты
Width Ширина
Height Высота
Placemark List Список идентификаторов для отображения меток на карте (например, если они с разных карт).
Exclude Placemark List Список идентификаторов меток для исключения их отображения на карте
Placemark Group List Список идентификаторов групп для отображения меток на карте
Placemark Category List Список идентификаторов категорий для отображения меток на карте
Route List Список идентификаторов для отображения маршрутов на карте
Exclude Route List Список идентификаторов маршрутов для исключения их отображения на карте
Route Category List Список идентификаторов категорий для отображения маршрутов на карте
Path List Список идентификаторов для отображения путей на карте
Exclude Path List Список идентификаторов путей для исключения их отображения на карте
Path Group List Список идентификаторов групп для отображения путей на карте
Path Category List Список идентификаторов категорий для отображения путей на карте
Placemark for map center Новый центр карты, идентификатор метки, чьи координаты будут считаться центром карты. Метка должна быть задана широтой и долготой.
Action for centering placemark Действие, которое можно совершить с меткой, являющйеся новым центром карты
Enable Support External Link to Placemark Включает опцию по созданию своего собственного списка меток. См. также Tutorials.
Placemark Filter Фильтр меток


См. также

Плагин для компонента

Модуль для компонента


Language: English  • русский