iOS için Haritalar SDK'sı Stil Referansı

Platform seçin: Android iOS JavaScript

Stil seçenekleriyle standart Google harita stillerinin sunumunu özelleştirebilir, yollar, parklar, işletmeler ve diğer önemli yerler gibi özelliklerin görsel görünümünü değiştirebilirsiniz. Bu özelliklerin stilini değiştirmenin yanı sıra özellikleri tamamen de gizleyebilirsiniz. Bu, haritanın belirli bileşenlerini vurgulayabileceğiniz veya haritayı, çevreleyen sayfanın stilini tamamlamasını sağlayabileceğiniz anlamına gelir.

Örnekler

Aşağıdaki JSON stil beyanı, tüm harita özelliklerini griye dönüştürür, ardından ana yol geometrisi mavi renkle renklendirilir ve yatay etiketler tamamen gizlenir:

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

JSON nesnesi

JSON stil bildirimi aşağıdaki öğelerden oluşur:

  • featureType (isteğe bağlı) - bu stil değişikliği için seçilecek özellikler. Özellikler, haritadaki yollar, parklar, su kütleleri vb. coğrafi özelliklerdir. Bir özellik belirtmezseniz tüm özellikler seçilir.
  • elementType (isteğe bağlı) - Seçilecek belirtilen özelliğin mülkü. Öğeler, etiketler ve geometri dahil olmak üzere bir özelliğin alt parçalarıdır. Bir öğe belirtmezseniz özelliğin tüm öğeleri seçilir.
  • stylers - seçilen özelliklere ve öğelere uygulanacak kurallar. Stiller özelliğin rengini, görünürlüğünü ve ağırlığını belirtir. Bir özelliğe bir veya daha fazla stil aracı uygulayabilirsiniz.

Stil belirtmek için bir featureType ve elementType seçici grubu ile stylers öğenizi bir stil dizisinde birleştirmeniz gerekir. Tek bir dizide istediğiniz özellik kombinasyonunu hedefleyebilirsiniz. Bununla birlikte, tek seferde uygulayabileceğiniz stillerin sayısı sınırlıdır. Stil diziniz maksimum karakter sayısını aşarsa hiçbir stil uygulanmaz.

Bu sayfanın geri kalanında özellikler, öğeler ve stil araçları hakkında daha fazla bilgi bulabilirsiniz.

featureType

Aşağıdaki JSON snippet'i haritadaki tüm yolları seçer:

{
  "featureType": "road"
}

Özellikler veya özellik türleri; yollar, parklar, su kütleleri, işletmeler ve daha fazlası dahil olmak üzere haritadaki coğrafi niteliklerdir.

Özellikler, kök olarak all ile bir kategori ağacı oluşturur. Bir özellik belirtmezseniz tüm özellikler seçilir. Bir all özelliği belirtmek de aynı etkiye sahiptir.

Bazı özellikler, nokta gösterimi kullanarak belirttiğiniz alt özellikleri içerir. Örneğin, landscape.natural veya road.local. road gibi yalnızca üst özelliği belirtirseniz üst öğe için belirttiğiniz stiller, tüm alt öğeleri (ör. road.local ve road.highway) için geçerli olur.

Üst özellikler, alt özelliklerin hepsine dahil olmayan bazı öğeleri içerebilir.

Aşağıdaki özellikler kullanılabilir:

  • all (varsayılan) tüm özellikleri seçer.
  • administrative tüm bağlı olduğu bölgeleri seçer. Stil, yalnızca bağlı olduğu bölgelerin etiketlerini etkiler, coğrafi sınırları veya dolguyu etkilemez.
    • administrative.country ülke seçer.
    • administrative.land_parcel arsa paketlerini seçer.
    • administrative.locality şehirleri seçer.
    • administrative.neighborhood mahalleleri seçer.
    • administrative.province il seçer.
  • landscape tüm manzaraları seçer.
    • landscape.man_made, binalar ve diğer yapılar gibi insan yapımı özellikleri seçer.
    • landscape.natural; dağlar, nehirler, çöller ve buzullar gibi doğal özellikleri seçer.
    • landscape.natural.landcover, yer örtüsü özelliklerini (ör. ormanlar, çayırlar, sulak alanlar ve çıplak topraklar gibi) dünyanın yüzeyini kaplayan fiziksel malzeme olarak seçer.
    • landscape.natural.terrain, bir kara yüzeyinin yükseklik, eğim ve yön gibi arazi özelliklerini seçer.
  • poi tüm önemli yerleri seçer.
    • poi.attraction turistik yerleri seçiyor.
    • poi.business, işletmeleri seçer.
    • poi.government hükümet binalarını seçer.
    • poi.medical; hastaneler, eczaneler, polisler, doktorlar ve diğer acil durum hizmetlerini seçer.
    • poi.park, parkları seçer.
    • poi.place_of_worship kilise, tapınak, cami gibi ibadet yerlerini seçer.
    • poi.school okulları seçer.
    • poi.sports_complex spor komplekslerini seçer.
  • road tüm yolları seçer.
    • road.arterial ana yolları seçer.
    • road.highway otoyolları seçer.
    • road.highway.controlled_access, kontrollü erişimle otoyolları seçer.
    • road.local yerel yolları seçer.
  • transit, tüm toplu taşıma istasyonlarını ve hatlarını seçer.
    • transit.line, toplu taşıma hatlarını seçer.
    • transit.station tüm toplu taşıma istasyonlarını seçer.
    • Havalimanlarını transit.station.airport seçer.
    • transit.station.bus otobüs duraklarını seçer.
    • transit.station.rail, tren istasyonlarını seçer.
  • water su kütlelerini seçer.

elementType

Aşağıdaki JSON snippet'i tüm yerel yolların etiketlerini seçer:

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

Öğeler, bir özelliğin alt bölümleridir. Örneğin bir yol, haritadaki grafik çizgiden (Geometri) ve adını belirten metinden (etiket) oluşur.

Aşağıdaki öğeler kullanılabilir ancak belirli bir özelliğin, öğelerin hiçbirini, bir kısmını veya tamamını desteklemeyebileceğini unutmayın:

  • all (varsayılan), belirtilen özelliğin tüm öğelerini seçer.
  • geometry, belirtilen özelliğin tüm geometrik öğelerini seçer.
    • geometry.fill, yalnızca özelliğin geometrisinin dolgusunu seçer.
    • geometry.stroke, yalnızca özelliğin geometrisinin çizgisini seçer.
  • labels, belirtilen özellikle ilişkili metin etiketlerini seçer.
    • labels.icon yalnızca özelliğin etiketinde gösterilen simgeyi seçer.
    • labels.text yalnızca etiketin metnini seçer.
    • labels.text.fill yalnızca etiketin dolgusunu seçer. Etiketin dolgusu genellikle etiket metnini çevreleyen renkli bir dış çizgi olarak oluşturulur.
    • labels.text.stroke yalnızca etiket metninin fırçasını seçer.

stylers

Stil araçları, harita özelliklerine ve öğelerine uygulayabileceğiniz biçimlendirme seçenekleridir.

Aşağıdaki JSON snippet'inde bir özellik RGB değeri kullanılarak parlak yeşil olarak gösterilmektedir:

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

Bu snippet, başlangıç renginden bağımsız olarak bir özelliğin rengindeki tüm yoğunluğu kaldırır. Bunun sonucunda özellik gri tonlamalı hale gelir:

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

Bu snippet bir özelliği tamamen gizler:

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

Aşağıdaki stil seçenekleri desteklenir:

  • hue (#RRGGBB biçimindeki RGB onaltılık dizesi) temel rengi gösterir.

    Not: Bu seçenek, varsayılan Google stilinde (veya haritada tanımladığınız diğer stil seçeneklerinde) belirtilen doygunluk ve açıklığı korurken tonu belirler. Ortaya çıkan renk, temel haritanın stiline göre belirlenir. Google, temel harita stilinde değişiklik yaparsa bu değişiklikler haritanızın stili hue ile belirlenen özelliklerini etkiler. Mümkünse mutlak color stil aracı kullanmak daha iyidir.

  • lightness (-100 ile 100 arasında bir kayan nokta değeri), öğenin parlaklığındaki yüzdelik değişimi belirtir. Negatif değerler koyuluğu artırır (burada -100 siyahı belirtir), pozitif değerler parlaklığı artırır (+100 beyazı belirtir).

    Not: Bu seçenek, varsayılan Google stilinde (veya haritada tanımladığınız diğer stil seçeneklerinde) belirtilen doygunluk ve tonu korurken ışığı ayarlar. Ortaya çıkan renk, temel haritanın stiline göre belirlenir. Google, temel harita stilinde değişiklik yaparsa bu değişiklikler haritanızın stili lightness ile belirlenen özelliklerini etkiler. Mümkünse mutlak color stil aracı kullanmak daha iyidir.

  • saturation (-100 ile 100 arasında bir kayan nokta değeri), öğeye uygulanacak temel rengin yoğunluğundaki yüzde değişimini belirtir.

    Not: Bu seçenek, varsayılan Google stilinde (veya haritada tanımladığınız diğer stil seçeneklerinde) belirtilen ton ve açıklığı korurken doygunluğu ayarlar. Ortaya çıkan renk, temel haritanın stiline göre belirlenir. Google, temel harita stilinde değişiklik yaparsa bu değişiklikler haritanızın stili saturation ile belirlenen özelliklerini etkiler. Mümkünse mutlak color stil özelliklerini kullanmak daha iyidir.

  • gamma (0.01 ile 10.0 arasında olup 1.0 düzeltme uygulamadığında kayan nokta değeri), öğeye uygulanacak gama düzeltmesi miktarını belirtir. Gama düzeltmeleri, renklerin açıklığını doğrusal olmayan bir şekilde değiştirir, beyaz veya siyah değerlerini etkilemez. Gama düzeltmesi genellikle birden fazla öğenin kontrastını değiştirmek için kullanılır. Örneğin, öğelerin kenarları ve iç kısımları arasındaki kontrastı artırmak veya azaltmak için gama üzerinde değişiklik yapabilirsiniz.

    Not: Bu seçenek, ışığı bir gama eğrisi kullanarak varsayılan Google stiline göre ayarlar. Google, temel harita stilinde değişiklik yaparsa bu değişiklikler haritanızın stili gamma ile belirlenen özelliklerini etkiler. Mümkünse mutlak color stil cihazı kullanmak daha iyidir.

  • invert_lightness (true ise) mevcut ışığı tersine çevirir. Bu, örneğin beyaz metin içeren daha koyu bir haritaya hızlıca geçiş yapmak için yararlıdır.

    Not: Bu seçenek varsayılan Google stilini tersine çevirir. Google, temel harita stilinde değişiklik yaparsa bu değişiklikler haritanızın stili invert_lightness ile belirlenen özelliklerini etkiler. Mümkünse mutlak color stil özelliklerini kullanmak daha iyidir.

  • visibility (on, off veya simplified), öğenin haritada olup olmadığını ve nasıl görüneceğini belirtir. simplified görünürlüğü, bazı stil özelliklerini etkilenen özelliklerden kaldırır. Örneğin, yollar dış çizgi olmadan daha ince çizgilerle sadeleştirilir, parklar ise etiket metnini kaybeder ancak etiket simgesini korur.
  • color (#RRGGBB biçimindeki RGB onaltılık dizesi) özelliğin rengini belirler.
  • weight (sıfıra eşit veya sıfırdan büyük bir tam sayı değeri), özelliğin ağırlığını piksel cinsinden ayarlar. Ağırlığın yüksek bir değere ayarlanması, karo kenarlıklarının yakınında kırpmaya neden olabilir.

Stil kuralları belirttiğiniz sıraya göre uygulanır. Birden fazla işlemi tek bir stilde birleştirmeyin. Bunun yerine, her işlemi stil dizisinde ayrı bir giriş olarak tanımlayın.

Not: Bazı işlemler değişimli olmadığından sıralama önemlidir. Stil işlemleri aracılığıyla değiştirilen özelliklerin ve/veya öğelerin (genellikle) zaten mevcut stilleri vardır. İşlemler, varsa bu mevcut stillere göre hareket eder.

Ton, doygunluk, açıklık modeli

Stilli haritalar, stil aracı işlemlerindeki rengi belirtmek için ton, doygunluk, açıklık (HSL) modelini kullanır. Ton temel rengi, doygunluk bu rengin yoğunluğunu ve açıklık, bileşen rengin göreli beyaz veya siyah miktarını belirtir.

Gama düzeltme, genellikle kontrastı artırmak veya azaltmak için renk alanı üzerindeki ışığı değiştirir. Buna ek olarak, HSL modeli bir koordinat alanında renk tanımlar. Burada hue bir renk çemberi içindeki yönü belirtirken, doygunluk ve açıklık farklı eksenler boyunca genliği belirtir. Tonlar, RGB renk alanında ölçülür. RGB renk alanı, beyaz ve siyah tonların kullanılmadığı çoğu RGB renk alanına benzer.

Ton, doygunluk, açıklık modeli

hue, HTML onaltılık renk değerini alırken, bu değeri yalnızca temel rengi, yani yüzde değişimi olarak ayrı ayrı belirtilen doygunluk veya açıklığı değil, renk çemberinin etrafındaki yönünü belirlemek için kullanır.

Örneğin, saf yeşilin tonunu hue:0x00ff00 veya hue:0x000100 olarak tanımlayabilirsiniz. İki ton da aynıdır. Her iki değer de HSL renk modelinde saf yeşili gösterir.

RGB Renk Çarkı

Eşit miktarda kırmızı, yeşil ve maviden oluşan RGB hue değerleri, bu değerlerin hiçbiri HSL koordinat alanında bir yön belirtmediği için bir ton belirtmez. "#000000" (siyah), "#FFFFFF" (beyaz) ve tüm gri tonları bunlara örnek olarak verilebilir. Siyah, beyaz veya gri belirtmek için tüm saturation öğelerini kaldırmanız (değeri -100 olarak ayarlayın) ve bunun yerine lightness değerini ayarlamanız gerekir.

Ayrıca, halihazırda renk şeması olan mevcut özellikler değiştirilirken hue gibi bir değerin değiştirilmesi, mevcut saturation veya lightness değerini değiştirmez.