JS Animated. Как добавить/изменить маркеры на карте (на основе RD Google Map)

Из этого туториала Вы узнаете, как добавить/изменить маркеры на карте (на основании RD Google Map) в JS-анимированных шаблонах.

Для того чтобы проверить, использует ли ваша карта плагин «RD Google Map», Вам нужно проверить, есть ли файл jquery.rd-google-map.js в папке js на вашем сервере.

Для того чтобы добавить/изменить маркеры на карте, Вам нужно отредактировать файл .html с кодом карты.

Вы можете найти корневую папку вашего сайта на сервере.

Для того чтобы добавить/изменить маркеры на карте, следуйте таким инструкциям:

1. Получите координаты карты: Вы можете использовать Карты Google или любой другой инструмент, который поможет вам получить широту и долготу объекта;

2. Подключитесь к вашему серверу используя клиент FTP или Файловый менеджер Панели управления хостингом;

3. Внесите изменения в файл .html с кодом карты, который расположен в корневой папке сайта на сервере.

4. Найдите код списка карты:

   <ul class="map_locations"></ul>
   

   Добавьте новый элемент списка, используя <li></li> тэги html и определите 2 атрибута: data-x (северная широта) и data-y (восточная долгота).

5. В результате Вы получите следующую строку кода, которую нужно добавить в код карты в файле .html:

    <li data-x="--72.9874068" data-y="39.643180"></li> 

6. Вот пример кода карты с добавленной строкой:

   <div id="google-map" class="map_model"></div>
   	<ul class="map_locations">
   		<li data-x="-73.9874068" data-y="40.643180">
   			<p> 9870 St Vincent Place, Glasgow, DC 45 Fr 45. <span>800 2345-6789</span></p>
   		</li>
   	</ul>
   </div>

   Где:

   <li data-x="-72.9874068" data-y="39.643180">
   	<p> 9870 St Vincent Place, Glasgow, DC 45 Fr 45. <span>800 2345-6789</span></p>
   </li>

   это маркер на карте:

   

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

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