Destek

Bu sayfada, vektör haritaları ve WebGL özellikleriyle ilgili bilinen sorunlar ve çözümler listelenmektedir.

Tarayıcı/cihaz desteği

WebGL özelliği önizlemesi, Maps JavaScript API ile aynı tarayıcıları ve cihazları destekler. Belirli bir cihazdaki tarayıcının WebGL'yi destekleyip desteklemediğini kontrol etmek için get.webgl.org veya caniuse.com adresini ziyaret edin. Ayrıca, tarayıcı ayarlarında donanım hızlandırmanın etkinleştirildiğinden emin olun. Aksi takdirde vektör haritaları raster'a geri döner.

Kafes mi, vektör mü?

Zaman zaman bir vektör haritası kafese geri dönebilir. Böyle bir durumda, vektör haritasına bağlı özellikler kullanılamaz. Kafes eşlemenin yedeklenmesi çeşitli nedenlerle meydana gelebilir. Bu bölümde, web tarayıcınızı doğru şekilde nasıl yapılandıracağınız ve vektör haritası yeteneğinin mevcut olup olmadığını programlı bir şekilde nasıl kontrol edeceğiniz gösterilmektedir.

Chrome'da tarayıcı özelliklerini kontrol etme

Belirli bir Chrome yüklemesinde hangi donanım hızlandırma özelliklerinin etkinleştirildiğini belirlemek için chrome://gpu/ sayfasına gidin ve aşağıdaki öğelerin etkinleştirildiğinden (yeşil renkte) emin olun:

  • "OpenGL: Etkin"
  • "WebGL: Donanım hızlandırılmış"
  • "WebGL2: Donanım hızlandırmalı"

(Bunlar yalnızca temel gereksinimlerdir. Desteği etkileyen başka faktörler de olabilir. Aşağıdaki "Bilinen hatalar" bölümüne bakın.)

Donanım hızlandırmayı etkinleştirme

Vektör haritalarını desteklemek için donanım hızlandırma özelliğinin çoğu tarayıcıda etkinleştirilmesi gerekir. Chrome ve Microsoft Edge'de donanım hızlandırmayı etkinleştirmek için Ayarlar'ı açın, Sistem'i seçin ve Kullanılabilir olduğunda donanım hızlandırmayı kullan seçeneğinin etkinleştirildiğinden emin olun.

Kafes veya vektörü programatik olarak kontrol etme

map.getRenderingType() yöntemini çağırarak bir haritanın kafes mi yoksa vektör mü olduğunu programlı bir şekilde kontrol edebilirsiniz. Aşağıdaki örnekte, renderingtype_changed etkinliğini izlemek için kullanılacak kod ve bir kafes ya da vektör haritasının kullanımda olup olmadığını gösteren bir bilgi penceresi gösterilmektedir.

TypeScript

/**
 * This example creates a map with an info window that shows whether
 * the map render type is raster or vector.
 */

 function initMap() {
    const center = {lat: 0, lng: 0};
    const map = new google.maps.Map(document.getElementById('map') as HTMLElement, {
      center,
      zoom: 10,
      heading: 0.0,
      tilt: 0.0,
      // Map ID for a vector map.
      mapId: '6ff586e93e18149f',
    });
    const canvas = document.createElement("canvas");
    const infoWindow = new google.maps.InfoWindow({
      content: '',
      ariaLabel: 'Raster/Vector',
      position: center,
    });
    infoWindow.open({
      map,
    });

    map.addListener('renderingtype_changed', () => {
      infoWindow.setContent(`${map.getRenderingType()}`);
    });
  }

  declare global {
    interface Window {
      initMap: () => void;
    }
  }
  window.initMap = initMap;
index.ts

JavaScript

/**
 * This example creates a map with an info window that shows whether
 * the map render type is raster or vector.
 */
function initMap() {
  const center = { lat: 0, lng: 0 };
  const map = new google.maps.Map(document.getElementById("map"), {
    center,
    zoom: 10,
    heading: 0.0,
    tilt: 0.0,
    // Map ID for a vector map.
    mapId: "6ff586e93e18149f",
  });
  const canvas = document.createElement("canvas");
  const infoWindow = new google.maps.InfoWindow({
    content: "",
    ariaLabel: "Raster/Vector",
    position: center,
  });

  infoWindow.open({
    map,
  });
  map.addListener("renderingtype_changed", () => {
    infoWindow.setContent(`${map.getRenderingType()}`);
  });
}

window.initMap = initMap;
index.js

WebGL 2'nin desteğini kontrol etmek için WebGL oluşturma bağlamını da kullanabilirsiniz:

const canvas = document.createElement("canvas");
canvas.getContext("webgl2") ? console.log("WebGL 2 is supported") : console.log("WebGL 2 is NOT supported");

WebGL oluşturma bağlamını programlı bir şekilde algılamanın diğer yollarını öğrenin.

Mobil web desteği

Vektör haritaları için mobil web desteği hâlâ deneme aşamasındadır. Geliştiriciler, mobil web tarayıcılarını algılamak için istemci API'lerini kullanabilir ve vektör haritası yerine kafes haritasıyla ilişkilendirilmiş bir harita kimliği kullanabilir. Bazı mobil cihazlarda oluşturma performansının daha yavaş olacağını öngörüyoruz. Mobil web'de vektör haritalarını kullanmayı seçerseniz, performans istatistikleri ve geri bildirimler bizi çok memnun edecektir. Yukarıda olduğu gibi, Vektör Haritaları desteği olmadığında vektör harita kimliği otomatik olarak kafes haritasına dönecektir.

Böcekler

Bilinen hatalar

  • AMD GPU'lara sahip bazı macOS cihazlarda, Chrome'da bilinen bir sorun vardır. Bu durum özellikle macOS, birden fazla GPU'ya sahip cihazlarda GPU'lar arasında dinamik olarak geçiş yaptığında kafa karıştırıcı olabilir. Bu nedenle, diğer uygulamaların çalıştırılmasına veya harici bir monitörün bağlı olup olmamasına bağlı olarak vektör haritaları kullanılamayabilir. Chrome'un yakında kullanıma sunulacak ANGLE Metal arka ucunun etkinleştirilmesi, bazı durumlarda bu sorunu çözmektedir. Bununla ilgili genel kullanıma sunma planlarını https://bugs.chromium.org/p/chromium/issues/detail?id=1322521 adresinden takip edebilirsiniz.

Hata bildirme

  • Hatayı bildirmeden önce lütfen tarayıcı ve GPU sürücüsünü en son sürüme güncelleyin.
  • chrome://settings/system (Chrome), about:preferences#general (Firefox), edge://settings/system (Microsoft Edge) içindeki donanım hızlandırma ayarının etkin olduğundan emin olun. Safari'de bu ayar macOS 10.15 veya sonraki sürümlerde otomatik olarak etkinleştirilir. Daha eski MacOS sürümleri için lütfen Safari gelişmiş ayarlarına gidin ve "Donanım hızlandırmayı kullan" seçeneğinin etkinleştirildiğinden emin olun.
  • Hata raporuna jsfiddle örnek kod bağlantısını ekleyin.
  • Ayrıca, lütfen chrome://gpu (Chrome), about:support (Firefox) veya edge://gpu (Microsoft Edge) ekran görüntüsünü alın, oluşturma sorunuyla karşılaşırsanız GPU ile ilgili bilgileri hata raporuna ekleyin.

Düşüncelerinizi bizimle paylaşın

Siz ve son kullanıcılarınız için en iyi vektör harita deneyimini oluşturmaya çalışırken geri bildirimlerinize değer veriyoruz. Aşağıdaki durumlardan birini bize bildirin:

  • Web uygulamalarınızda tespit ettiğiniz yeni JavaScript hataları veya hatalar/çökmeler olduğunda.
  • Vektör haritaları için başlatma gecikmesi, raster haritalardan çok daha düşüktür. Bu durumda, başlangıç gecikmesi regresyonu metrikleri çok yararlıdır. Genel olarak, başlatma gecikmesinin kabul edilebilir eşiklerin ötesine geçip geçmediğini bilmek isteriz.
  • Vektör haritaları deneyimi yeterince akıcı değil. FPS veya darbe metriklerini günlüğe kaydederseniz bunların vektör ve kafes haritaları arasında nasıl bir fark vardır?
  • Performans tarayıcıya göre büyük farklılık gösterir.

Vektör haritaları ile kafes haritalarının karşılaştırması için A/B testi oluşturduysanız lütfen elde ettiğiniz performans geri bildirimlerini bizimle paylaşın. Bu geri bildirimler, özelliği iyileştirmemize yardımcı olacaktır.