Використання API Карт Google для радіальної відстані

Автор: Eugene Taylor
Дата Створення: 13 Серпень 2021
Дата Оновлення: 14 Листопад 2024
Anonim
Використання API Карт Google для радіальної відстані - Статті
Використання API Карт Google для радіальної відстані - Статті

Зміст

Ви можете налаштувати карту Google для задоволення конкретних потреб аудиторії вашого сайту за допомогою API Карт 3.0. Одним з методів персоналізації є вставка кола, що показує радіус відстані навколо конкретного місця. Ви можете, наприклад, показати радіус п'яти миль навколо туристичного місця, щоб відвідувачі могли побачити прилеглі готелі та ресторани. Щоб створити радіус відстані навколо місця або точки, скористайтеся класом "Коло" в Картах Google.


Інструкції

  1. Відкрийте файл HTML і перейдіть до розділу, який містить код карти Google.

  2. Прокрутіть код доки не знайдете розташування маркера. Щоб легко знайти закладку, знайдіть термін "google.maps.Marker" у файлі HTML.

  3. Нижче, де ви встановите маркер, створіть шар "Коло" і приєднайте його до нього. Наприклад, введіть:

    var circleExample = new google.maps.Circle ({map: map

  4. Додайте в метрах радіус кола, який буде навколо маркера:

    var circleExample = new google.maps.Circle ({map: радіус карти: 5000

  5. Створіть колір заповнення для кола. Колір можна встановити у шістнадцятковому форматі. Наприклад, введіть:

    var circleExample = new google.maps.Circle ({map: радіус карти: 5000 fillColor = #FFFFFF});

  6. Пов'яжіть або додайте коло до маркера:

    var circleExample = new google.maps.Circle ({map: радіус карти: 5000 fillColor = #FFFFFF}); circleExample.bindTo ('map', маркер);


  7. Збережіть карту та перевірте. Карти Google показують біле коло радіусом 5000 метрів навколо місця розташування маркера.