Pomoc

Na tej stronie znajdziesz znane problemy i sposoby obejścia problemów z mapami wektorowymi i funkcjami WebGL.

Obsługa przeglądarek/urządzeń

Wersja testowa funkcji WebGL działa w tych samych przeglądarkach i na tych samych urządzeniach co interfejs Maps JavaScript API. Aby sprawdzić, czy przeglądarka na danym urządzeniu obsługuje WebGL, wejdź na get.webgl.org lub caniuse.com. Upewnij się też, że w ustawieniach przeglądarki jest włączona akceleracja sprzętowa. W przeciwnym razie mapy wektorowe przełączą się na rastrową.

Raster czy wektor?

Czasami mapa wektorowa może wrócić do mapy rastrowej. W takim przypadku obiekty zależne od mapy wektorowej są niedostępne. Powrót do mapy rastrowej może wystąpić z różnych powodów. Z tej sekcji dowiesz się, jak prawidłowo skonfigurować przeglądarkę i jak automatycznie sprawdzić, czy dostępna jest mapa wektorowa.

Sprawdzanie możliwości przeglądarki Chrome

Aby określić, które funkcje akceleracji sprzętowej są włączone w konkretnej instalacji Chrome, otwórz chrome://gpu/ i upewnij się, że te elementy są włączone (kolor zielony):

  • „OpenGL: włączono”
  • „WebGL: akceleracja sprzętowa”
  • „WebGL2: akcelerowana sprzętowa”

To są tylko wymagania podstawowe. Na pomoc mogą wpływać też inne czynniki – patrz „Znane błędy” poniżej.

Włącz akcelerację sprzętową

Aby korzystać z map wektorowych, w większości przeglądarek musi być włączona akceleracja sprzętowa. Aby włączyć akcelerację sprzętową w Chrome i Microsoft Edge, otwórz Ustawienia, wybierz System i upewnij się, że opcja Użyj akceleracji sprzętowej, gdy jest dostępna jest włączona.

Programowe sprawdzanie rastrów lub wektorów

Możesz programowo sprawdzić, czy mapa jest rastrowa czy wektorowa, wywołując funkcję map.getRenderingType(). Poniższy przykład pokazuje kod do monitorowania zdarzenia renderingtype_changed i pokazuje okno informacyjne z informacją, czy używana jest mapa rastrowa lub wektorowa.

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

Możesz też użyć kontekstu renderowania WebGL, aby sprawdzić obsługę WebGL 2:

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

Poznaj inne sposoby automatycznego wykrywania kontekstu renderowania WebGL.

Obsługa internetu mobilnego

Obsługa map wektorowych w internecie mobilnym jest wciąż w fazie eksperymentalnej. Deweloperzy mogą używać interfejsów API klienta do wykrywania przeglądarek internetowych mobilnych i używać identyfikatora mapy powiązanego z mapą rastrową zamiast mapy wektorowej. Przewidujemy wolniejsze renderowanie na niektórych urządzeniach mobilnych. Jeśli zdecydujesz się korzystać z map wektorowych w przeglądarce mobilnej, będziemy wdzięczni za statystyki wydajności i opinie. Tak jak powyżej, jeśli obsługa map wektorowych nie jest dostępna, identyfikator mapy wektorowej automatycznie wróci do korzystania z mapy rastrowej.

Błędy

Znane błędy

  • Na niektórych urządzeniach z systemem macOS i procesorami graficznymi AMD występuje znany problem w Chrome. Może to być szczególnie kłopotliwe, gdy macOS dynamicznie przełącza się między GPU na urządzeniach z kilkoma układami GPU, dlatego mapy wektorowe mogą być niedostępne w zależności od tego, jakie inne aplikacje działają lub czy podłączony jest monitor zewnętrzny. W niektórych przypadkach włączenie backendu ANGLE Metal w Chrome prawdopodobnie rozwiąże ten problem. Ogólne plany wdrażania tej funkcji znajdziesz na stronie https://bugs.chromium.org/p/chromium/issues/detail?id=1322521.

Zgłaszanie błędów

  • Zanim zgłosisz błąd, zaktualizuj przeglądarkę i sterownik GPU do najnowszej wersji.
  • Upewnij się, że ustawienie akceleracji sprzętowej na urządzeniach chrome://settings/system (Chrome), about:preferences#general (Firefox) i edge://settings/system (Microsoft Edge) jest włączone. W Safari to ustawienie jest włączane automatycznie w systemie macOS 10.15 lub nowszym. W starszych wersjach systemu macOS otwórz ustawienia zaawansowane Safari i upewnij się, że włączona jest opcja „Użyj akceleracji sprzętowej”.
  • Dołącz do raportu o błędzie link do przykładowego kodu jsfiddle.
  • Zrób też zrzut ekranu przeglądarki chrome://gpu (Chrome), about:support (Firefox) lub edge://gpu (Microsoft Edge). Jeśli napotkasz problemy z renderowaniem, dołącz informacje dotyczące GPU w raporcie o błędzie.

Chcemy poznać wasze opinie

Twoja opinia jest dla nas bardzo ważna, ponieważ staramy się, aby mapy wektorowe były jak najbardziej przydatne dla Ciebie i Twoich użytkowników. Poinformuj nas, czy:

  • Wykryliśmy w Twoich aplikacjach internetowych nowe błędy JavaScriptu.
  • Czas oczekiwania na uruchomienie w przypadku map wektorowych jest znacznie mniejszy niż w przypadku map rastrowych. W takim przypadku bardzo pomocne są wskaźniki regresji czasu oczekiwania na uruchomienie. Interesuje nas, czy czas oczekiwania na uruchomienie powróci do przekraczania dopuszczalnych progów.
  • Korzystanie z map wektorowych nie jest tak płynne, jak byłoby to możliwe. Jak wyglądają wskaźniki FPS lub dziwne dane w przypadku map wektorowych i rastrowych?
  • Wydajność różni się znacznie w zależności od przeglądarki.

Jeśli masz skonfigurowane testy A/B do porównania map wektorowych z mapami rastrowymi, prześlij nam opinię o wydajności, ponieważ pomoże nam ona w ulepszaniu tej funkcji.