Краткий гайд по установке и использованнию google maps add-on.
Для начало необходимо освоить азы шаманства.

После того как подготовительный этап пройден, то остается лишь сделать последовательность простых маневров:

1. Создаем spring boot vaadin проект.

2. Далее делаем корректировку зависимостей согласно шаманству.

3. Добавляем зависимость на аддон карты.

4. Теперь необходимо скомпилировать widgetset для карт. Подробнее все в том же шаманстве. В итоге в widgetset.gwt.xml получим следующую запись:

5. Теперь, чтобы воспользоваться картами необходимо всего лишь получить ключ на API в Developer Console.

Developer console projects
Developer console projects

Если в списке существующих проектов есть тот, который можно использовать для привязки к картам, то можно выбрать его, иначе перейдем к созданию нового проекта. Нажимаем Create project.

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

В появившемся окне вводим название нашего проекта и нажимаем Create.

Выбор проекта из projects list
Выбор проекта из projects list

Выбираем созданный проект из списка ( после создания он выбран по умолчанию) и переходим во вкладку APIs & auth.

Google APIs
Google APIs

Далее выбираем пункт APIs и в нем выбираем интересующий нас Google Maps JavaScript API.

Добавление в проект Google Maps JS API v3
Добавление в проект Google Maps JS API v3

Жмем Enable API.

Создание public key
Создание public key

Переходим в пункт Credentails и под записью Public API Access, жмем Create new Key. Нам нужен Browser key.

Теперь создавая GoogleMap vaadin View, нужно передавать в качестве параметра сгенерированный ключ.

Если теперь разместить view как контент UI, то получим следующий результат:

Google map vaadin view
Google map vaadin view

Vaadin. Google maps add-on
Метки:        

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">