Migracja: moduł Map w google.load

13 października 2021 r. wyłączymy usługę, która udostępnia moduł „Mapy” na potrzeby google.load. Jeśli po 13 października 2021 r. spróbujesz użyć modułu „Mapy” w sekcji google.load, wyświetli się błąd (moduł „maps” nie jest obsługiwany) i żadna mapa nie zostanie wczytana. Aby uniknąć potencjalnych awarii, musisz przełączyć się na jedną z tych opcji.

Co muszę zrobić?

Najpierw usuń tag <script>, który wczytuje tag google.load, a potem usuń wywołania google.load. Jeśli używasz programu Google Loader do innych celów, możesz pozostawić tag <script> wczytujący na swoim miejscu.

Następnie zaimplementuj nowy sposób wczytywania interfejsu Maps JavaScript API (wybierz jedną z tych opcji):

Bieżący przykład z użyciem Google Loader

Poniższy przykład pokazuje, jak Google Loader jest obecnie używany do wczytywania interfejsu JavaScript JavaScript API (dwa bloki <script>):

Przed

<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type='text/javascript'>
google.load("maps", "3.exp", {
    "callback": initMap,
    "key": "YOUR_KEY",
    "libraries": "places,visualization"
});
function initMap() {
  // Google Maps JS API is loaded and available
}
</script>

W takim przypadku interfejs Maps JavaScript API jest wczytywany podczas wczytywania strony. Aby zaimplementować wczytywanie bezpośrednie, zastąp tag <script>, który ładuje adres www.google.com/jsapi („przed”) tagiem <script>, jak w tym przykładzie:

<script async src="https://maps.googleapis.com/maps/api/js?libraries=places,visualization&key=YOUR_API_KEY&v=weekly&callback=initMap">
</script>

Następnie w kodzie JavaScript usuń wywołanie funkcji google.load, bo nie jest już potrzebne. Poniższy przykład pokazuje pustą funkcję initMap(), która jest wywoływana po załadowaniu biblioteki Map Google:

<script type='text/javascript'>
function initMap() {
  // Google Maps JS API is loaded and available
}
</script>

Zobacz dokumentację

Dynamiczne ładowanie z innego pliku JavaScript

Dynamiczne ładowanie umożliwia kontrolowanie, kiedy ma być wczytywany interfejs Maps JavaScript API. Możesz na przykład zaczekać na wczytanie interfejsu Maps JavaScript API, aż użytkownik kliknie przycisk lub wykona inną czynność. Aby zastosować dynamiczne ładowanie, zastąp tag <script>, który wczytuje adres www.google.com/jsapi („przed”), i automatycznie dodaj tag <script>, jak pokazano w tym przykładzie:

var script = document.createElement('script');
script.src =
'https://maps.googleapis.com/maps/api/js?libraries=places,visualization&key=YOUR_API_KEY&v=weekly&callback=initMap';
script.async=true;

Następnie dodaj funkcję wywołania zwrotnego do obiektu okna w ten sposób:

window.initMap = function() {
  // Google Maps JS API is loaded and available
};

Na koniec dodaj tag <script> do nagłówka strony w ten sposób:

document.head.appendChild(script);

Zobacz dokumentację