На страницах моего блога я уже касался темы использования Google Maps Street View — «Несколько примеров использования Street View от Google Maps».
Эта заметка была написана в марте 2012 года, когда севис Google Maps Street View только пришел в Россию.
За 2013 год произошел большой рост сервиса в России, теперь доступны 3D-панорамы более 200 российских городов.
И в этой заметке я хочу Вам показать один интересный пример использования Google Maps Street View.
За основу взят пример по этому адресу: http://www.redtreesoft.com/Google/GoogleDrivingView.htm
С начала Вы указываете адреса начальной и конечной точки маршрута, затем строится маршрут, а затем Вы можете провести виртуальную поездку по маршруту.
Подробнее смотрите видео.
Давайте рассмотрим работу примера подробнее, а затем я поясню основные моменты в коде примера.
Переходим по ссылке — https://webmap-blog.ru/examples/gmap-streetview-direction/gmap-streetview.html
У нас появляется страница следующего содержания
По умолчанию в форме находятся два адреса:
— начальный
— конечный
Далее нажимаем кнопку «Маршрут»
На карте в окне слева строиться маршрут.
Далее нажимаем на кнопку «Пуск»
Начинается движение по маршруту и в окне с права Вы наблюдаете процедуру движения.
Чтобы посмотреть движение по маршруту обратно, нажимаем на кнопку «Обратно», а затем «Пуск».
Можно изменить параметры движения, выбрав соответствующую опцию в поле «Режим движения» и «Скорость».
Давайте теперь рассмотрим код примера.
Код
Его можно разделить на несколько частей, каждая из которых отвечает за реализацию нужной функциональности.
В начале производится инициализация основных параметров карты.
Функция GetRoute отвечает за построение маршрута проезда.
Функция showSteps выводит элементы маршрутного листа под окнами с картой и Street View.
Функция GoBack меняет местами начальную и конечную точки маршрута.
За отображение Street View отвечает функция processSVData.
А статическое изображение выводит функция UpdateSV.
За геокодирование адресов отвечает функция GeocodeAB.
Загрузить архив с кодом примера Вы сможете отсюда — https://webmap-blog.ru/files/arhivs/gmap-streetview.zip
Надеюсь, что данный пример будет полезен Вам для использования при разработке Ваших проектов.