Migracja: moduł Map w google.load

13 października 2021 r. wyłączymy usługę udostępniającą „Mapy” moduł google.load. Oznacza to, że jeśli po 13 października 2021 r. będziesz używać kart „Mapy” moduł w zakresie google.load wyświetli się błąd (moduł „mapy” nie jest obsługiwany) i żadna mapa nie zostanie wczytana. Aby uniknąć potencjalnych awarii, przejdź na jeden z nich dostępnych rozwiązań.

Co muszę zrobić?

Najpierw usuń tag <script>, który wczytuje moduł ładujący google.load, a następnie usuń połączenia z numerem google.load. Jeśli używasz Google Loader do innych wszystko, możesz zostawić tag <script> ładowania na swoim miejscu.

Następnie zaimplementuj nowy sposób wczytywania interfejsu Maps JavaScript API (wybierz skorzystaj z jednej z poniższych opcji:

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

W poniższym przykładzie pokazano, jak jest używany komponent Google Loader do wczytywania Maps JavaScript API (są 2 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 wczytuje się w podczas wczytywania strony. Aby wdrożyć wczytywanie bezpośrednie, najpierw zastąp <script>, który wczytuje www.google.com/jsapi ("before") z? Tag <script> widoczny 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, ponieważ nie jest już potrzebna. Poniższy przykład to pusty atrybut initMap() funkcja, która jest wywoływana po załadowaniu biblioteki Map:

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

Zapoznaj się z dokumentacją

Dynamiczne ładowanie z innego pliku JavaScript

Dynamiczne ładowanie pozwala kontrolować, kiedy interfejs Maps JavaScript API ma być ładowany. Dla: możesz poczekać z wczytaniem Maps JavaScript API do momentu, użytkownik klika przycisk lub wykonuje inne działanie. Aby wdrożyć ładowanie dynamiczne, najpierw zastąp tag <script>, który wczytuje www.google.com/jsapi ("before")? za pomocą kodu umożliwiającego automatyczne dodanie tagu <script>, jak 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 dołącz funkcję wywołania zwrotnego do obiektu window 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 taki sposób:

document.head.appendChild(script);

Zapoznaj się z dokumentacją