Dokumentacja stylu interfejsu API Map Tiles

Za pomocą opcji stylu możesz dostosować wygląd standardowych reklam Mapy Google. Możesz zmienić wygląd obiektów, takich jak drogi, parki, firmy i inne ciekawe miejsca. Oprócz zmiany tych obiektów mapy, możesz również całkowicie ukryć obiekty. Dzięki temu takie jak wyróżnianie określonych elementów mapy aby pasowały do stylu otaczającej strony.

Przykłady

Poniższa deklaracja stylu JSON zmienia kolor wszystkich funkcji mapy na wyszarzony, a następnie kolory geometrii arterii komunikacyjnej na niebiesko i ukrywa etykiety krajobrazu całkowicie:

[
  {
    "featureType": "all",
    "stylers": [
      { "color": "#C0C0C0" }
    ]
  },{
    "featureType": "road.arterial",
    "elementType": "geometry",
    "stylers": [
      { "color": "#CCFFFF" }
    ]
  },{
    "featureType": "landscape",
    "elementType": "labels",
    "stylers": [
      { "visibility": "off" }
    ]
  }
]

Obiekt JSON

Deklaracja stylu JSON składa się z tych elementów:

• featureType (opcjonalny) – funkcje do wyboru. dla tej modyfikacji stylu. Cechy to cechy geograficzne na mapę, w tym drogi, parki, zbiorniki wodne i inne. Jeśli nie określisz obiektu, wybrane są wszystkie obiekty.
• elementType (opcjonalny) – właściwość elementu określoną cechę do wyboru. Elementy to części składowe obiektu, w tym etykiet i geometrii. Jeśli nie określisz elementu, wszystkie elementy obiekt.
• stylers – reguły, które mają być stosowane do wybranych obiektów . Style określają kolor, widoczność i wagę obiektu. Do obiektu możesz zastosować jeden lub więcej stylów.

Aby określić styl, musisz połączyć elementy featureType i Selektory elementType i stylers w stylu . Możesz kierować reklamy na dowolną kombinację cech w jednej tablicy. Pamiętaj jednak: liczba stylów, które można zastosować jednocześnie, jest ograniczona. Jeśli Twój styl tablica przekracza maksymalną liczbę znaków, styl nie został zastosowany.

Pozostała część tej strony zawiera więcej informacji o funkcjach, elementach stylizatory.

featureType

Ten fragment kodu JSON wybiera wszystkie drogi na mapie:

{
  "featureType": "road"
}

Obiekty lub typy obiektów to cechy geograficzne na mapie, w tym drogi, parki, zbiorniki wodne, firmy i inne.

Cechy tworzą drzewo kategorii, przy czym all jako pierwiastka. Jeśli nie określisz obiektu, wybrane zostaną wszystkie obiekty. Ten sam efekt ma określenie cechy all.

Niektóre cechy zawierają cechy podrzędne określane za pomocą kropki . Na przykład landscape.natural lub road.local Jeśli określisz tylko funkcję nadrzędną, np. road, do których będą stosowane style określone dla elementu nadrzędnego wszystkich jego elementów podrzędnych, takich jak road.local i road.highway

Pamiętaj, że funkcje nadrzędne mogą zawierać elementy, które nie są uwzględnione we wszystkich funkcjach podrzędnych.

Dostępne są te funkcje:

• all (domyślnie) wybiera wszystkie funkcje.
• administrative wybiera wszystkie obszary administracyjne. Styl wpływa tylko na etykiety obszarów administracyjnych, a nie geograficzne obramowania lub wypełnienia.
  • administrative.country wybiera kraje.
  • administrative.land_parcel wybiera działki.
  • administrative.locality wybiera miejscowości.
  • administrative.neighborhood wybiera dzielnice.
  • administrative.province wybiera prowincje.
• landscape wybiera wszystkie krajobrazy.
  • landscape.man_made wybiera obiekty stworzone przez człowieka, takie jak budynki i inne w różnych strukturach.
  • landscape.natural wybiera obiekty naturalne, takie jak góry, rzeki, pustynie i lodowce.
  • landscape.natural.landcover wybiera elementy pokrycia terenu, materiał fizyczny pokrywa powierzchnię Ziemi, np. lasy, łąki, mokradła i pusty teren.
  • landscape.natural.terrain wybiera elementy terenu na poziomie gruntu. takich jak wysokość, nachylenie i orientacja.
• poi zaznacza wszystkie ciekawe miejsca.
  • poi.attraction wybiera atrakcje turystyczne.
  • poi.business wybiera firmy.
  • poi.government wybiera budynki rządowe.
  • poi.medical wybiera służby ratunkowe, w tym: szpitale, apteki, policja, lekarze itp.
  • poi.park wybiera parki.
  • poi.place_of_worship wybiera miejsca kultu, w tym kościoły, świątynie, meczety itp.
  • poi.school wybiera szkoły.
  • poi.sports_complex wybiera kompleksy sportowe.
• road zaznacza wszystkie drogi.
  • road.arterial wybiera drogi główne.
  • road.highway wybiera autostrady.
  • road.highway.controlled_access wybiera autostrady z: kontrolowanego dostępu.
  • road.local wybiera drogi lokalne.
• transit wybiera wszystkie stacje i linie transportu publicznego.
  • transit.line wybiera linie transportu publicznego.
  • transit.station wybiera wszystkie stacje transportu publicznego.
  • transit.station.airport wybiera lotniska.
  • transit.station.bus wybiera przystanki autobusowe.
  • transit.station.rail wybiera stacje kolejowe.
• water wybiera zbiorniki wodne.

elementType

Ten fragment kodu JSON wybiera etykiety dla wszystkich dróg lokalnych:

{
  "featureType": "road.local",
  "elementType": "labels"
}

Elementy to podgrupy cech. Droga, na przykład składa się z linii graficznej (geometrii) na mapie, a także tekstu określające jego nazwę (etykietę).

Dostępne są następujące elementy, pamiętaj jednak, że konkretna funkcja może nie obsługiwać żadnego, niektórych lub wszystkich elementów:

• all (domyślnie) wybiera wszystkie elementy określonej cechy.
• geometry wybiera wszystkie elementy geometryczne w określonym zakresie funkcji.
  • geometry.fill wybiera tylko wypełnienie obiektu geometrii.
  • geometry.stroke wybiera tylko kreskę obiektu geometrii.
• labels wybiera etykiety tekstowe powiązane z tagiem zgodnie z określoną cechą.
  • labels.icon wybiera tylko ikonę wyświetlaną w etykiety funkcji.
  • labels.text zaznaczy tylko tekst etykiety.
  • labels.text.fill wybiera tylko wypełnienie etykiety. wypełnienie etykiety zwykle renderuje się jako kolorowy kontur, otacza tekst etykiety.
  • labels.text.stroke wybiera tylko kreski tekstu.

stylers

Style to opcje formatowania, które możesz zastosować do obiektów mapy i .

Poniższy fragment kodu JSON zawiera funkcję w kolorze jasnozielonym z użyciem atrybutu Wartość RGB:

"stylers": [
  { "color": "#99FF33" }
]

Ten fragment kodu usuwa całą intensywność z koloru obiektu, niezależnie od jej kolor początkowy. Efektem jest wyrenderowanie skali szarości:

"stylers": [
  { "saturation": -100 }
]

Ten fragment kodu ukrywa funkcję całkowicie:

    "stylers": [
      { "visibility": "off" }
    ]

Obsługiwane są te opcje stylu:

• hue (szesnastkowy ciąg znaków w formacie RGB) #RRGGBB) wskazuje kolor podstawowy.

  Uwaga: ta opcja ustawia barwę przy zachowaniu nasycenia i jasności określone w domyślnym stylu Google (lub w innych opcjach stylu na mapie). Otrzymany kolor zależy od stylu elementu mapy podstawowej. Jeśli Google wprowadzi zmiany w stylu mapy podstawowej, wpływają na obiekty mapy z atrybutem hue. Lepiej użyj bezwzględnego stylizatora color, jeśli to możliwe.

• lightness (wartość zmiennoprzecinkowa między -100 i 100) wskazuje procentową zmianę jasności . Wartości ujemne zwiększają ciemność (gdzie -100 oznacza czarny) a wartości dodatnie zwiększają jasność (gdzie +100 oznacza biały).

  Uwaga: ta opcja ustawia jasność przy zachowaniu nasycenia i barwy określone w domyślnym stylu Google (lub w innych opcjach stylu na mapie). Otrzymany kolor zależy od stylu elementu mapy podstawowej. Jeśli Google wprowadzi zmiany w stylu mapy podstawowej, wpływają na obiekty mapy z atrybutem lightness. Lepiej aby użyć bezwzględnego stylizatora color, jeśli to możliwe.

• saturation (wartość zmiennoprzecinkowa między -100 i 100) wskazuje procentową zmianę intensywności podstawowy kolor elementu.

  Uwaga: ta opcja ustawia nasycenie przy zachowaniu barwy i jasności. określone w domyślnym stylu Google (lub w innych opcjach stylu na mapie). Otrzymany kolor zależy od stylu elementu mapy podstawowej. Jeśli Google wprowadzi zmiany w stylu mapy podstawowej, wpływają na obiekty mapy z atrybutem saturation. Jest lepiej jest użyć stylu bezwzględnego color, jeśli to możliwe.

• gamma (wartość zmiennoprzecinkowa z zakresu od 0.01 do 10.0, gdzie 1.0 nie stosuje korekty) wskazuje zakres korekcji gamma elementu. Korekty gamma modyfikują jasność kolorów w sposób nieliniowy, nie wpływając na białe lub czarne. Korekcja gamma jest zwykle używana do kontrast wielu elementów. Można na przykład zmienić zakres gamma na Zwiększ lub zmniejsz kontrast między krawędziami a wnętrzem .

  Uwaga: ta opcja dostosowuje jasność względem domyślnego poziomu jasności ekranu za pomocą krzywej gamma. Jeśli Google wprowadzi jakiekolwiek zmiany na mapie podstawowej stylu, zmiany te wpłyną na obiekty mapy gamma Lepiej jest użyć bezwzględnej color jak to możliwe.

• invert_lightness (jeśli true) odwraca istniejący poziom jasności. Jest to przydatne na przykład w przypadku szybkiego przełączyć na ciemniejszą mapę z białym tekstem.

  Uwaga: ta opcja po prostu odwraca domyślny styl Google. Jeśli Google nie wprowadzisz żadnych zmian w stylu mapy podstawowej, funkcje z motywem invert_lightness. Jest lepiej jest użyć stylu bezwzględnego color, jeśli to możliwe.

• visibility (on, off lub simplified) wskazuje, czy i w jaki sposób element jest widoczny mapę. Widoczność simplified usuwa niektóre cechy stylu z funkcji, których dotyczy problem; na przykład drogi są upraszczane jako cieńsze, linii bez obramowań. Parki tracą tekst etykiety, ale zachowują ikonę etykiety.
• color (szesnastkowy ciąg znaków w formacie RGB) #RRGGBB) ustawia kolor obiektu.
• Zestawy: weight (wartość całkowita, większa lub równa 0) waga obiektu w pikselach. Ustawienie wysokiej wartości wagi może w pobliżu obramowania kafelków.

Reguły stylu są stosowane w określonej kolejności. Nie łącz wiele operacji w jedną operację stylu. Zamiast tego zdefiniuj każdy jako osobny wpis w tablicy stylów.

Uwaga: kolejność jest ważna, ponieważ niektóre operacje nie są przemienne. Funkcje i/lub elementów zmodyfikowanych przez operacje stylu (zwykle) mają istniejące style. Operacje są wykonywane na istniejących stylach (jeśli są dostępne).

Model barwy, nasycenia i jasności

W stylach map używane są odcienie, nasycenie, jasność (HSL) do określenia koloru w stylu operacji. Odcień wskazuje kolor podstawowy, nasycenie. wskazuje intensywność danego koloru, a jasność wskazuje jego intensywność. względna ilość bieli lub czerni w kolorze składowym.

Gamma korekcja modyfikuje jasność w przestrzeni kolorów, zwykle aby zwiększyć lub zmniejszyć kontrast. Dodatkowo model HSL definiuje kolor w przestrzeni współrzędnych, gdzie hue wskazuje orientację na kole kolorów, a nasycenie i jasność wskazują amplitudy wzdłuż różnych osi. Odcienie są mierzone w przestrzeni kolorów RGB, która jest podobna do większości przestrzeni kolorów RGB, z wyjątkiem odcieni bieli i czarnych.

hue pobiera szesnastkową wartość koloru HTML, ale używa tylko tej wartości. aby określić kolor podstawowy, czyli jego orientację wokół koloru a nie jego nasycenie czy jasność, wyrażonych oddzielnie jako zmiany procentowe.

Możesz na przykład zdefiniować odcień koloru zielonego jako hue:0x00ff00 lub hue:0x000100. Oba odcienie identyczna. Obie wartości w modelu kolorów HSL wskazują czystą zieleń.

Koło kolorów RGB

Wartości RGB hue złożone z czerwonych, zielonych i niebieskich w równych częściach nie wskazują barwy, bo żadna z tych wartości nie wskazuje orientacji przestrzeni współrzędnych HSL. Przykłady: „#000000” (czarny), „#FFFFFF” (biały), i wszystkich czystych odcieniach szarości. Aby zmienić kolor na czarny, biały lub szary, musisz: usuń wszystkie zmienne saturation (ustaw wartość na -100) i ustaw lightness.

Ponadto, gdy modyfikujesz istniejące obiekty, które mają już określony kolor schemat, zmiana wartości takiej jak hue nie powoduje zmiany obecnej wartości saturation lub lightness.