Максим Тимофеев

Для начала надо выбрать карты которые будете использовать (видимо гугл мапс), потом прочитать документацию к api этих карт:
https://developers.google.com/maps/documentation/
В первых же главах будет информация о масштабировании и координатах. Немного далее о нанесении точек на карту. И еще чуть далее примеры кастомных балунов и попапов.
Внимание: понадобятся знания js, вопрос интеграции карт лежит в плоскости js и мало связан с html и css, которые Вы указали в тегах.

Инициализируйте карту только после открытия модалки. Зачем Вы ее формируете до этого, если она скрыта? Это не оптимально по нагрузке и коряво работает.

Попробуйте так:

$this->registerJsFile(
'link',  
['position' => $this::POS_END, 'async'=>true, 'defer'=>true]);

или так

$this->registerJsFile(
'link',  
['position' => $this::POS_END, 'async'=>'async', 'defer'=>'defer']);

https://www.google.com/business/

Вот что по Вашей ссылке:

и google и yandex гибко настраиваются. Но есть еще api.2gis.ru/doc/maps/ru/quickstart

Есть карты для навигационных программ. Например openstreetmap.ru . Можно попробовать портировать навигационное ПО или написать свое для таких карт. Соответственно их можно будет обновлять периодически.