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

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

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

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

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

• טעינת שורה באמצעות התג <script>
• טעינה דינמית מקובץ JavaScript אחר

דוגמה עדכנית לשימוש ב-Google Loader

בדוגמה הבאה אפשר לראות איך Google Loader משמש כרגע לטעינת Maps JavaScript API (יש שני בלוקים של <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>

טעינת שורה באמצעות התג <script> (מומלץ)

כשמשתמשים בגישה הזו, ממשק ה-JavaScript API של מפות Google נטען באותו הזמן שבו הדף נטען. כדי להטמיע טעינת שורה, קודם מחליפים את התג <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>

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

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

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

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

טעינה דינמית מאפשרת לכם לקבוע מתי Maps JavaScript API נטען. לדוגמה, אפשר להמתין לטעינת Maps JavaScript API עד שהמשתמש לוחץ על לחצן או מבצע פעולה אחרת. כדי להטמיע טעינת נתונים דינמית, קודם מחליפים את התג <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);

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