Yer simgeleri

Platform seçin: Android iOS JavaScript Web Hizmeti

Yer simgeleri, çeşitli yer türlerini (ör. kafeler, kütüphaneler ve müzeler) gösterir. Place Class veya Places Service'i kullanarak simge ve arka plan renkleri isteyebilirsiniz.

Alanlar

Yer simgeleriyle çalışmak için aşağıdaki alanları kullanın:

Alan	Yer Sınıfı	Yerler Hizmeti
Simge	---	icon
Simge arka plan rengi	iconBackgroundColor	icon_background_color
Simge maskesi URI'si	svgIconMaskURI	icon_mask_base_uri

• icon, renkli 71 piksel x 71 piksel PNG simgesinin URL'sini döndürür (yalnızca Yerler Hizmeti).
• iconBackgroundColor ve icon_background_color, yer simgesinin kategorisine ait varsayılan HEX renk kodunu döndürür.
• icon_mask_base_uri (Yerler Hizmeti), renkli olmayan bir simgenin temel URL'sini, dosya türü uzantısı çıkarılmış şekilde döndürür (.svg veya .png eklenir).
• svgIconMaskURI (Yer sınıfı), renkli olmayan bir SVG simgesinin temel URL'sini döndürür.

İşaretçiye yer simgesi ve renk uygulama

Yer ayrıntıları sayesinde, işaretçilere uygulayabileceğiniz bir yer simgesi ve arka plan rengi isteyebilirsiniz. Aşağıdaki örnekte, place.iconBackgroundColor değerini PinElement.background seçeneğine, place.svgIconMaskURI değerini ise PinElement.glyph seçeneğine göndererek yer verilerini kullanarak bir işaretçi oluşturma kodu gösterilmektedir. İşaretçiyi doğru konuma yerleştirmek için place.location simgesini kullanın. Bu örnekte, işaretçi başlığında place.displayName simgesi de gösterilmektedir.

TypeScript

// A marker customized using a place icon and color, name, and geometry.
const place = new Place({
    id: 'ChIJN5Nz71W3j4ARhx5bwpTQEGg',
});

// Call fetchFields, passing the desired data fields.
await place.fetchFields({ fields: ['location', 'displayName', 'svgIconMaskURI', 'iconBackgroundColor'] });

const pinElement = new PinElement({
    background: place.iconBackgroundColor,
    glyph: new URL(String(place.svgIconMaskURI)),
});

const placeIconMarkerView = new AdvancedMarkerElement({
    map,
    position: place.location,
    content: pinElement.element,
    title: place.displayName,
});
index.ts

Not: TypeScript ve Google Haritalar'ı kullanmayla ilgili kılavuzu okuyun.

JavaScript

// A marker customized using a place icon and color, name, and geometry.
const place = new Place({
  id: "ChIJN5Nz71W3j4ARhx5bwpTQEGg",
});

// Call fetchFields, passing the desired data fields.
await place.fetchFields({
  fields: [
    "location",
    "displayName",
    "svgIconMaskURI",
    "iconBackgroundColor",
  ],
});

const pinElement = new PinElement({
  background: place.iconBackgroundColor,
  glyph: new URL(String(place.svgIconMaskURI)),
});
const placeIconMarkerView = new AdvancedMarkerElement({
  map,
  position: place.location,
  content: pinElement.element,
  title: place.displayName,
});
index.js

Örneğe bakın

Simge ve arka plan rengi isteği gönderme

Aşağıdaki tablolarda, kategoriye göre tüm mevcut yer simgeleri gösterilmektedir. Bunlar varsayılan olarak siyah bir simgeyle gösterilir. Simgenin arka plan rengi, yerin kategorisine göre belirlenir.

Yer kategorisi: Yiyecek ve içecek (simge arka plan rengi #FF9E67)
Bar, Gece kulübü	Kafe	Restoran, Fırın
Yer kategorisi: Perakende (simge arka plan rengi #4B96F3)
Kitap, Giyim, Elektronik, Mücevher, Ayakkabı, Alışveriş merkezi	Market	Bakkal, Süpermarket	Eczane
Yer kategorisi: Hizmetler (simge arka plan rengi #909CE1)
ATM	Banka	Gaz	Konaklama
Postane
Yer kategorisi: Eğlence (simge arka plan rengi #13B5C7)
Akvaryum, Turist	Golf	Tarihi	Film
Müze	Tiyatro
Yer kategorisi: Ulaşım (simge arka plan rengi #10BDFF)
Havalimanı	Otobüs, araç paylaşma, taksi	Tren/Demiryolu
Yer kategorisi: Belediye/genel/dini (simge arka plan rengi #7B9EB0)
Mezarlık	Kamu binası	Kitaplık	Anıt
Otopark	Okul (ilkokul, ortaokul, üniversite)	İbadet (Hristiyan)
Tapınma (Hindu)	İbadet (İslam)	Tapınma (Jain)	İbadet (Yahudi)
Tapınma (Sih)	Genel işletme
Yer kategorisi: Açık hava (simge arka plan rengi #4DB546)
Tekne	Kamp	Park	Stadyum
Hayvanat bahçesi
Yer kategorisi: Acil durum (simge arka plan rengi #F88181)
Hastane	Polis