Pomoc

Na tej stronie znajdziesz listę znanych problemów i obejść dotyczących map wektorowych i funkcji WebGL.

Obsługa przeglądarek i urządzeń

Wersja przedpremierowa funkcji WebGL obsługuje te same przeglądarki i urządzenia 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 zostaną zastąpione rastrowymi.

Mapa rastrowa czy wektorowa?

Czasami mapa wektorowa może zostać zastąpiona rastrową. W takim przypadku funkcje zależne od mapy wektorowej są niedostępne. Zastąpienie mapy wektorowej rastrową może nastąpić z różnych powodów. Z tej sekcji dowiesz się, jak prawidłowo skonfigurować przeglądarkę internetową i jak programowo sprawdzić, czy jest dostępna funkcja mapy wektorowej.

Sprawdzanie możliwości przeglądarki w Chrome

Aby sprawdzić, 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 (na zielono):

  • „OpenGL: Enabled” (OpenGL: włączony)
  • „WebGL: Hardware accelerated” (WebGL: akceleracja sprzętowa)
  • „WebGL2: Hardware accelerated” (WebGL2: akceleracja sprzętowa)

(To tylko podstawowe wymagania. Mogą występować inne czynniki, które mają wpływ na obsługę. Więcej informacji znajdziesz w sekcji „Znane błędy” poniżej).

Włączanie akceleracji sprzętowej

Aby obsługiwać mapy wektorowe, 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, czy mapa jest rastrowa czy wektorowa

Możesz programowo sprawdzić, czy mapa jest rastrowa czy wektorowa, wywołując map.getRenderingType(). Poniższy przykład pokazuje kod, który monitoruje zdarzenie renderingtype_changed i wyświetla okno informacyjne wskazujące, czy używana jest mapa rastrowa, czy mapa 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;

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;

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");

Dowiedz się, jak programowo wykrywać kontekst renderowania WebGL.

Obsługa internetu mobilnego

Obsługa internetu mobilnego w przypadku map wektorowych jest nadal w fazie eksperymentalnej. Programiści mogą używać interfejsów API klienta do wykrywania przeglądarek internetowych na urządzeniach mobilnych i używania identyfikatora mapy powiązanego z mapą rastrową zamiast z mapą wektorową. W przypadku niektórych urządzeń mobilnych spodziewamy się wolniejszego renderowania. Jeśli zdecydujesz się używać map wektorowych w internecie mobilnym, będziemy wdzięczni za statystyki wydajności i opinie. Jak wspomnieliśmy wcześniej, jeśli obsługa map wektorowych jest niedostępna, identyfikator mapy wektorowej automatycznie przełączy się na mapę rastrową.

Błędy

Znane błędy

  • W Chrome na niektórych urządzeniach z macOS z GPU AMD występuje znany problem. Może to być szczególnie mylące, gdy macOS dynamicznie przełącza się między GPU na urządzeniach z wieloma GPU. W zależności od tego, jakie inne aplikacje są uruchomione lub czy jest podłączony monitor zewnętrzny, mapy wektorowe mogą być niedostępne. W niektórych przypadkach włączenie nadchodzącego backendu ANGLE Metal w Chrome rozwiązuje ten problem. Ogólne plany wdrożenia 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 jest włączone w chrome://settings/system (Chrome), about:preferences#general (Firefox) lub edge://settings/system (Microsoft Edge). W Safari to ustawienie jest włączone automatycznie w macOS w wersji 10.15 lub nowszej. W starszych wersjach macOS otwórz ustawienia zaawansowane Safari i upewnij się, że opcja „Użyj akceleracji sprzętowej” jest włączona.
  • W raporcie o błędach podaj link do przykładowego kodu jsfiddle.
  • Jeśli napotkasz problemy z renderowaniem, zrób też zrzut ekranu chrome://gpu (Chrome), about:support (Firefox) lub edge://gpu (Microsoft Edge) i dołącz do raportu o błędach informacje związane z GPU.

Chcemy poznać wasze opinie

Cenimy Twoje opinie, ponieważ staramy się zapewnić Tobie i Twoim użytkownikom jak najlepsze wrażenia z korzystania z map wektorowych. Daj nam znać, jeśli:

  • w aplikacjach internetowych wykryjesz nowe błędy JavaScript lub błędy/awarie;
  • opóźnienie uruchamiania map wektorowych jest znacznie większe niż w przypadku map rastrowych. W takim przypadku bardzo przydatne są dane o regresji opóźnienia uruchamiania. Ogólnie rzecz biorąc, chcemy wiedzieć, czy opóźnienie uruchamiania przekracza dopuszczalne progi.
  • korzystanie z map wektorowych nie jest tak płynne, jak mogłoby być. Jeśli rejestrujesz dane o liczbie klatek na sekundę lub o zacięciach, jak wypadają one w porównaniu z mapami wektorowymi i mapami rastrowymi?
  • wydajność znacznie się różni w zależności od przeglądarki.

Jeśli masz skonfigurowane testy A/B do porównania map wektorowych z mapami rastrowymi, udostępnij nam wszelkie informacje o wydajności, które uzyskasz, ponieważ pomogą nam one udoskonalić tę funkcję.