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

در 13 اکتبر 2021، سرویسی را که ماژول «Maps» را برای google.load ارائه می‌کند، خاموش می‌کنیم. این بدان معناست که پس از 13 اکتبر 2021، اگر سعی کنید از ماژول "Maps" در google.load استفاده کنید، یک خطا دریافت خواهید کرد ( ماژول "maps" پشتیبانی نمی شود ) و هیچ نقشه ای بارگیری نمی شود. برای کمک به جلوگیری از شکستگی احتمالی، باید به یکی از گزینه های جایگزین بروید.

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

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

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

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

مثال فعلی با استفاده از 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> (توصیه می شود)

وقتی از این رویکرد استفاده می‌شود، 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>

سپس در کد جاوا اسکریپت خود، فراخوانی تابع google.load را حذف کنید، زیرا دیگر به آن نیازی نیست. مثال زیر یک تابع initMap() خالی را نشان می دهد که زمانی که کتابخانه Maps با موفقیت بارگیری شد فراخوانی می شود:

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

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

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

بارگیری پویا به شما امکان می دهد زمان بارگیری 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;

سپس تابع callback خود را به شکل زیر به شی پنجره متصل کنید:

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

در نهایت تگ <script> را به عنوان زیر به سربرگ صفحه اضافه کنید:

document.head.appendChild(script);

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