Taşıma: google.load'daki Haritalar Modülü

13 Ekim 2021'de google.load için "Haritalar" modülünü sağlayan hizmeti kapatacağız. Bu nedenle, 13 Ekim 2021'den sonra google.load'te "Haritalar" modülünü kullanmaya çalışırsanız bir hata mesajı ("Haritalar" modülü desteklenmiyor) alırsınız ve hiçbir harita yüklenmez. Olası kesintilerden kaçınmak için alternatiflerden birine geçmeniz gerekir.

Ne yapmanız gerekiyor?

Öncelikle, google.load yükleyiciyi yükleyen <script> etiketini kaldırın, ardından google.load çağrılarını kaldırın. Google Yükleyici'yi başka şeyler için kullanıyorsanız yükleyici <script> etiketini yerinde bırakabilirsiniz.

Ardından, Maps JavaScript API'yi yüklemenin yeni bir yolunu uygulayın (aşağıdaki seçeneklerden birini belirleyin):

• <script> etiketini kullanarak satır içi yükleme
• Başka bir JavaScript dosyasından dinamik yükleme

Google Yükleyici'nin kullanıldığı mevcut örnek

Aşağıdaki örnekte, Google Loader'ın şu anda Maps JavaScript API'yi yüklemek için nasıl kullanıldığı gösterilmektedir (iki <script> bloğu vardır):

Önce

<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> etiketini kullanarak satır içi yükleme (önerilir)

Bu yaklaşım kullanıldığında Maps JavaScript API, sayfayla aynı anda yüklenir. Satır içi yüklemeyi uygulamak için öncelikle www.google.com/jsapi'yi ("önce") yükleyen <script> etiketini aşağıdaki örnekte gösterilen <script> etiketiyle değiştirin:

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

Ardından, artık gerekli olmadığı için JavaScript kodunuzdan google.load işlev çağrısını kaldırın. Aşağıdaki örnekte, Haritalar kitaplığı başarıyla yüklendiğinde çağrılan boş bir initMap() işlevi gösterilmektedir:

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

Belgelere göz atın

Başka bir JavaScript dosyasından dinamik yükleme

Dinamik yükleme, Maps JavaScript API'nin ne zaman yükleneceğini kontrol etmenizi sağlar. Örneğin, kullanıcı bir düğmeyi tıklayana veya başka bir işlem yapana kadar Maps JavaScript API'nin yüklenmesini bekleyebilirsiniz. Dinamik yüklemeyi uygulamak için öncelikle www.google.com/jsapi'yi ("önce") yükleyen <script> etiketini, aşağıdaki örnekte gösterildiği gibi <script> etiketini programatik olarak ekleyen kodla değiştirin:

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;

Ardından geri çağırma işlevinizi window nesnesine şu şekilde ekleyin:

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

Son olarak, <script> etiketini sayfanın başlığına şu şekilde ekleyin:

document.head.appendChild(script);

Belgelere göz atın