העברה: המודול של מפות Google ב-google.load

ב-13 באוקטובר 2021 נשבית את השירות שמספק את 'מפות' של google.load. המשמעות היא שאחרי 13 באוקטובר 2021, אם תנסו להשתמש ב'מפות' מודול ב google.load תתקבל שגיאה (המודול "מפות" לא נתמך), וגם לא תיטען מפה. כדי למנוע תקלות אפשריות, צריך להחליף לאחת מהאפשרויות של החלופות.

מה עליי לעשות?

קודם כול צריך להסיר את התג <script> שטוען את ה-load של google.load, לאחר מכן להסיר את השיחות אל google.load. אם משתמשים ב-Google Loader דברים, זה בסדר להשאיר את תג <script> של הטוען במקום.

בשלב הבא, מטמיעים דרך חדשה לטעינת ה-API של JavaScript של מפות Google (יש לבחור אחת מהאפשרויות הבאות):

הדוגמה הנוכחית באמצעות Google Loader

הדוגמה הבאה מציגה איך Google Loader משמש כרגע לטעינת JavaScript API של מפות Google (יש שתי חסימות של <script>):

לפני

<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>

כשמשתמשים בגישה הזאת, Maps JavaScript API נטען באותו זמן שבו הדף נטען. כדי להטמיע טעינה מוטבעת, קודם צריך להחליף את תג <script> שטוען את www.google.com/jsapi (לפני") עם התג תג <script> מוצג בדוגמה הבאה:

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

לאחר מכן, בקוד ה-JavaScript מסירים את הבקשה להפעלת הפונקציה google.load, כי הוא כבר לא נחוץ. בדוגמה הבאה מוצג שדה initMap() ריק בפונקציה, שנשלחת כאשר הספרייה של 'מפות Google' נטענת בהצלחה:

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

לעיון במסמכי התיעוד

טעינה דינמית מקובץ JavaScript אחר

טעינה דינמית מאפשרת לקבוע מתי ממשק ה-API של JavaScript של מפות Google ייטען. עבור לדוגמה, אפשר להמתין לטעינה של ממשק ה-API של JavaScript של מפות Google עד משתמש לוחץ על לחצן או מבצע פעולה אחרת. כדי להטמיע טעינה דינמית, תחילה צריך להחליף את התג <script> שטוען את www.google.com/jsapi (לפני") בקוד כדי להוסיף באופן פרוגרמטי את התג <script>, כמו בדוגמה הבאה:

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;

לאחר מכן, מחברים את פונקציית הקריאה החוזרת לאובייקט החלון, באופן הבא:

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

בסוף, מוסיפים את התג <script> לכותרת הדף, באופן הבא:

document.head.appendChild(script);

לעיון במסמכי התיעוד