مهاجرت: ماژول نقشه ها در google.load

در ۱۳ اکتبر ۲۰۲۱، سرویسی که ماژول "نقشه‌ها" را برای google.load ارائه می‌دهد، غیرفعال خواهیم کرد. این بدان معناست که پس از ۱۳ اکتبر ۲۰۲۱، اگر سعی کنید از ماژول "نقشه‌ها" در google.load استفاده کنید، با خطایی ( ماژول "نقشه‌ها" پشتیبانی نمی‌شود ) مواجه خواهید شد و هیچ نقشه‌ای بارگذاری نخواهد شد. برای جلوگیری از خرابی احتمالی، باید به یکی از گزینه‌های جایگزین بروید.

چه کاری باید انجام دهم؟

ابتدا، تگ <script> که google.load loader را بارگذاری می‌کند، حذف کنید، سپس فراخوانی‌های google.load را نیز حذف کنید. اگر از Google Loader برای موارد دیگری استفاده می‌کنید، می‌توانید تگ <script> loader را به حال خود رها کنید.

در مرحله بعد، یک روش جدید برای بارگذاری API جاوا اسکریپت Maps پیاده‌سازی کنید (یکی از گزینه‌های زیر را انتخاب کنید):

• بارگذاری درون‌خطی با استفاده از تگ <script>
• بارگذاری پویا از یک فایل جاوا اسکریپت دیگر

مثال فعلی با استفاده از Google Loader

مثال زیر نشان می‌دهد که چگونه در حال حاضر از Google Loader برای بارگذاری API جاوا اسکریپت Maps استفاده می‌شود (دو بلوک <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> (توصیه می‌شود)

وقتی از این رویکرد استفاده می‌شود، API جاوا اسکریپت Maps همزمان با بارگذاری صفحه بارگذاری می‌شود. برای پیاده‌سازی بارگذاری درون‌خطی، ابتدا تگ <script> که www.google.com/jsapi ( "before" ) را بارگذاری می‌کند، با تگ <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 را حذف کنید، زیرا دیگر نیازی به آن نیست. مثال زیر یک تابع initMap() خالی را نشان می‌دهد که وقتی کتابخانه Maps با موفقیت بارگذاری می‌شود، فراخوانی می‌شود:

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

مستندات را ببینید

بارگذاری پویا از یک فایل جاوا اسکریپت دیگر

بارگذاری پویا به شما امکان می‌دهد زمان بارگذاری API جاوا اسکریپت Maps را کنترل کنید. برای مثال، می‌توانید منتظر بمانید تا API جاوا اسکریپت Maps بارگذاری شود تا زمانی که کاربر روی یک دکمه کلیک کند یا اقدام دیگری انجام دهد. برای پیاده‌سازی بارگذاری پویا، ابتدا تگ <script> که www.google.com/jsapi ( "before" ) را بارگذاری می‌کند، با کدی جایگزین کنید تا تگ <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);

مستندات را ببینید