Карти Google без ключа API

Зазвичай, інтегруючи Google Maps, ви працюєте з API Maps Maps JavaScript , який вимагає ключ API і може спричинити витрати, які не слід недооцінювати за допомогою вищих номерів доступу. Є чудові альтернативи, такі як mapbox або OpenStreetMap , але вони ще не досягають різноманітності функцій, пропонованих Google. Сама Google також пропонує спосіб без ключа API за допомогою функції спільного доступу, яку ми можемо використовувати для своїх цілей.


Цей шлях можна використовувати програмно для виведення будь-якої адреси (навіть не знаючи широти та довготи). Крім того, карта (на відміну від аналога JS) містить посилання на планувальник маршруту. Карту також можна розробити за допомогою фільтрів CSS (хоча результат не зовсім наближається до власних стилів , які можливі за допомогою JS API).

Протягом багатьох років це можна було зробити за допомогою параметра output = embed , який Google офіційно не підтримує, і тому помилки відображення зростали в недалекому минулому:

331190767bb32b2468632e609223c53e

Якщо ви використовуєте офіційну функцію спільного використання через maps.google.de , ви отримаєте такий код, наприклад:

331190767bb32b2468632e609223c53e

Якщо ми структуруємо довгу URL-адресу в параметрі src , вийде шаблон:

331190767bb32b2468632e609223c53e

Ми розпізнаємо такі типи даних:

  • m: матриця
  • s: рядок
  • f: плавати
  • d: Подвійний
  • i: ціле число
  • e: перелік

Після декількох спроб спроб та помилок ми можемо усунути деякі значення та упакувати найважливіші значення у змінні, наприклад, щоб динамічно визначити адресу:

331190767bb32b2468632e609223c53e

Нарешті, ми можемо додати на карту гарніший вигляд, наприклад, за допомогою наступного коду CSS:

331190767bb32b2468632e609223c53e

Зрештою, ми отримуємо безкоштовну динамічну карту, яка надійно працює:

Назад