Bir harita yerleştirme

Bu kılavuzda, etkileşimli bir haritayı web sayfanıza nasıl yerleştireceğiniz gösterilmektedir.

Maps Embed API URL'sini oluşturma

Aşağıda, Maps Embed API'yi yükleyen örnek bir URL verilmiştir:

https://www.google.com/maps/embed/v1/MAP_MODE?key=YOUR_API_KEY&PARAMETERS

Değiştir:

  • MAP_MODE harita modunuzu değiştirebilirsiniz.
  • API anahtarınızla YOUR_API_KEY. Daha fazla bilgi için API anahtarı alma başlıklı makaleyi inceleyin.
  • PARAMETERS ile harita modunuz için gerekli ve isteğe bağlı parametreleri gönderin.

URL'yi bir iframe'e ekleme

Maps Embed API'yi web sayfanızda kullanmak için kullandığınız URL'yi ayarlayın bir iframe'in src özelliğinin değeri olarak oluşturulur. Haritanın boyutunu, iframe'ın height ve width özellikleriyle kontrol edebilirsiniz. Örneğin:

<iframe
  width="450"
  height="250"
  frameborder="0" style="border:0"
  referrerpolicy="no-referrer-when-downgrade"
  src="https://www.google.com/maps/embed/v1/MAP_MODE?key=YOUR_API_KEY&PARAMETERS"
  allowfullscreen>
</iframe>

Yukarıdaki iframe örneğinde aşağıdaki ek özellikler kullanılır:

  • Haritanın belirli bölümlerinin tam ekran moduna geçmesi için allowfullscreen özelliği.
  • Haritanın etrafındaki standart iFrame kenarlığını kaldırmak için frameborder="0" ve style="border:0" özellikleri.
  • Şuna izin verecek referrerpolicy="no-referrer-when-downgrade" özelliği: tam URL'yi istekle birlikte Referer başlığı olarak göndermesini API anahtarı kısıtlamaları düzgün çalışabilir.

iframe'i kendi web sitenizin yapısına ve tasarımına uyacak şekilde yeniden boyutlandırabilirsiniz. Ancak ziyaretçilerin daha büyük haritalarla etkileşimde bulunmayı genellikle daha kolay bulduğunu görüyoruz. 200 pikselden küçük olan yerleşik haritaların boyutunu oluşturabilirsiniz.

API anahtarı kısıtlamaları

Barındırma web sitesinde no-referrer olarak ayarlanmış bir referrer meta etiketi varsa same-origin, tarayıcı Referer üstbilgisini Google'a göndermez. Bu durum, API anahtarı kısıtlamanızın istekleri reddetmesine neden olabilir. Kısıtlamanın düzgün çalışması için, Referer üstbilgilerinin Google'a gönderilmesine açıkça izin vermek üzere yukarıdaki örnekte gösterildiği gibi iframe'e bir referrerpolicy mülkü ekleyin.

Haritadaki reklamlar

Maps Embed API, harita üzerinde reklamcılığı içerebilir. Reklam biçimi ve herhangi bir haritada gösterilen reklam kümesi haber verilmeden değiştirilebilir.

Harita modlarını seçme

İstek URL'nizde kullanmak üzere aşağıdaki harita modlarından birini belirtebilirsiniz:

  • place: Belirli bir yer veya adreste (ör. önemli bir yer, işletme, coğrafi özellik veya kasaba) bir harita raptiyesi gösterir.
  • view: İşaretçi veya yol tarifi içermeyen bir harita döndürür.
  • directions: Haritada belirtilen iki veya daha fazla nokta arasındaki yolu, mesafeyi ve seyahat süresini gösterir.
  • streetview: Belirtilen konumlardan alınan etkileşimli panoramik görüntüleri gösterir.
  • search: Görünür harita bölgesinde yapılan bir aramanın sonuçlarını gösterir.

place modu

Aşağıdaki URL'de, Eyfel Kulesi'nde bir harita işaretçisi görüntülemek için place harita modu kullanılmaktadır:

https://www.google.com/maps/embed/v1/place
  ?key=YOUR_API_KEY
  &q=Eiffel+Tower,Paris+France

Aşağıdaki parametreleri kullanabilirsiniz:

Parametre Tür Açıklama Kabul edilen değerler
q Zorunlu Harita işaretçisinin konumunu tanımlar. URL çıkışlı yer adı, adres, artı kodu veya yer kimliği. Haritalar İçe Aktarma API'si, boşluklardan kaçarken hem + hem de %20'ü destekler. Örneğin, "City Hall, New York, NY"yi City+Hall,New+York,NY veya "849VCWC8+R9" kodlarını 849VCWC8%2BR9 olarak dönüştürün.
center İsteğe bağlı Harita görünümünün merkezini tanımlar. Virgülle ayrılmış enlem ve boylam değerlerini kabul eder, örneğin: 37.4218,-122.0840
zoom İsteğe bağlı Haritanın ilk yakınlaştırma düzeyini ayarlar. 0 (tüm dünya) ile 21 arasında değişen değerler (bağımsız binalar). Üst sınır, seçilen konumda bulunan harita verilerine bağlı olarak değişebilir.
maptype İsteğe bağlı Yüklenecek harita karolarının türünü tanımlar. roadmap (varsayılan) veya satellite
language İsteğe bağlı Kullanıcı arayüzü öğeleri ve görüntülenmesi için kullanılacak dili tanımlar etiketleri kullanabilirsiniz. Varsayılan olarak, ziyaretçiler bir haritayı kendi başlarına görür dili'ne dokunun. Bu parametre yalnızca bazı ülke parçaları için desteklenir; eğer istenen dil karo grubu için desteklenmiyorsa o parça kümesi için varsayılan dil kullanılacak.
region İsteğe bağlı Coğrafi-politik hassasiyetlere göre görüntülenecek uygun sınırları ve etiketleri tanımlar. Bilinen ccTLD ("üst düzey alan") iki karakterli değerleriyle eşleşen iki karakterli (sayısal olmayan) unicode bölge alt etiketi olarak belirtilen bir bölge kodunu kabul eder. Bkz. Google Haritalar Platformu Desteklenen bölgeler için Kapsam Ayrıntıları'nı tıklayın.

view modu

Aşağıdaki örnekte, haritanın uydu görünümünü görüntülemek için view modu ve isteğe bağlı maptype parametresi kullanılmaktadır:

https://www.google.com/maps/embed/v1/view
  ?key=YOUR_API_KEY
  &center=-33.8569,151.2152
  &zoom=18
  &maptype=satellite

Aşağıdaki parametreleri kullanabilirsiniz:

Parametre Tür Açıklama Kabul edilen değerler
center Zorunlu Harita görünümünün merkezini tanımlar. Virgülle ayrılmış enlem ve boylam değerlerini kabul eder, örneğin: 37.4218,-122.0840
zoom İsteğe bağlı Haritanın ilk yakınlaştırma düzeyini ayarlar. 0 (tüm dünya) ile 21 arasında değişen değerler (bağımsız binalar). Üst sınır, seçilen konumda bulunan harita verilerine bağlı olarak değişebilir.
maptype İsteğe bağlı Yüklenecek harita karolarının türünü tanımlar. roadmap (varsayılan) veya satellite
language İsteğe bağlı Kullanıcı arayüzü öğeleri ve görüntülenmesi için kullanılacak dili tanımlar etiketleri kullanabilirsiniz. Varsayılan olarak, ziyaretçiler bir haritayı kendi başlarına görür dili'ne dokunun. Bu parametre yalnızca bazı ülke parçaları için desteklenir; eğer istenen dil karo grubu için desteklenmiyorsa o parça kümesi için varsayılan dil kullanılacak.
region İsteğe bağlı Coğrafi-politik hassasiyetlere göre görüntülenecek uygun sınırları ve etiketleri tanımlar. Bilinen ccTLD ("üst düzey alan") iki karakterli değerleriyle eşleşen iki karakterli (sayısal olmayan) unicode bölge alt etiketi olarak belirtilen bir bölge kodunu kabul eder. Desteklenen bölgeler için Google Haritalar Platformu Kapsam Ayrıntıları'na bakın.

directions modu

Aşağıdaki örnekte, Oslo ile Norveç'in Telemark kenti arasındaki yolu, mesafeyi ve otoyollardan ve ücretli yollardan kaçınarak seyahat süresini göstermek için directions modu kullanılmaktadır.

https://www.google.com/maps/embed/v1/directions
  ?key=YOUR_API_KEY
  &origin=Oslo+Norway
  &destination=Telemark+Norway
  &avoid=tolls|highways

Aşağıdaki parametreleri kullanabilirsiniz:

Parametre Tür Açıklama Kabul edilen değerler
origin Zorunlu Yol tariflerinin görüntüleneceği başlangıç noktasını tanımlar. URL çıkışlı yer adı, adres, artı kodu, enlem/boylam koordinatları veya yer kimliğini girin. Haritalar İçe Aktarma API'si, boşluklardan kaçarken hem + hem de %20'ü destekler. Örneğin, "City Hall, New York, NY"yi City+Hall,New+York,NY veya "849VCWC8+R9" kodlarını 849VCWC8%2BR9 olarak dönüştürün.
destination Zorunlu Yol tariflerinin bitiş noktasını tanımlar. URL çıkışlı yer adı, adres, artı kodu, enlem/boylam koordinatları veya yer kimliğini girin. Haritalar İçe Aktarma API'si, boşluklardan kaçarken hem + hem de %20'ü destekler. Örneğin, "City Hall, New York, NY"yi City+Hall,New+York,NY veya "849VCWC8+R9" kodlarını 849VCWC8%2BR9 olarak dönüştürün.
waypoints İsteğe bağlı Kalkış ve varış noktası arasında yol tarifi için bir veya daha fazla ara konum belirtir. Yer adı, adres veya yer kimliği. Yerleri ayırmak için dikey çizgi karakteri (|) kullanılarak birden fazla yol noktası belirtilebilir (ör. Berlin,Germany|Paris,France). 20'ye kadar yol noktası belirtebilirsiniz.
mode İsteğe bağlı Seyahat yöntemini tanımlar. Herhangi bir mod belirtilmezse Maps Embed API, web sayfası için en alakalı modlardan birini veya daha fazlasını gösterir. belirtilen rota. driving, walking (mevcut olduğunda yaya yollarını ve kaldırımları tercih eder), bicycling (mevcut olduğunda bisiklet yolları ve tercih edilen sokaklardan rota oluşturur), transit veya flying.
avoid İsteğe bağlı Yol tariflerinde kaçınmanız gereken özellikleri belirtir. Aksi halde Kısıtlanmış özellikleri içeren rotaları engellemeyecek; her bir görev için daha elverişli rotalara yönlendirilebilir. tolls, ferries ve/veya highways. Birden çok değeri dikey çizgi karakteriyle ayırın (ör. avoid=tolls|highways).
units İsteğe bağlı Sonuçlarda mesafeleri gösterirken ölçüm yöntemini (metrik veya İngiliz) belirtir. units belirtilmezse Kullanılacak birimleri, sorgudaki origin ülke belirler. metric veya imperial
center İsteğe bağlı Harita görünümünün merkezini tanımlar. Virgülle ayrılmış enlem ve boylam değerlerini kabul eder, örneğin: 37.4218,-122.0840
zoom İsteğe bağlı Haritanın ilk yakınlaştırma düzeyini ayarlar. 0 (tüm dünya) ile 21 arasında değişen değerler (bağımsız binalar). Üst sınır, seçilen konumda bulunan harita verilerine bağlı olarak değişebilir.
maptype İsteğe bağlı Yüklenecek harita karolarının türünü tanımlar. roadmap (varsayılan) veya satellite
language İsteğe bağlı Kullanıcı arayüzü öğeleri ve görüntülenmesi için kullanılacak dili tanımlar etiketleri kullanabilirsiniz. Varsayılan olarak, ziyaretçiler bir haritayı kendi başlarına görür dili'ne dokunun. Bu parametre yalnızca bazı ülke parçaları için desteklenir; eğer istenen dil karo grubu için desteklenmiyorsa o parça kümesi için varsayılan dil kullanılacak.
region İsteğe bağlı Coğrafi-politik hassasiyetlere göre görüntülenecek uygun sınırları ve etiketleri tanımlar. İki karakterli (sayısal olmayan) olarak belirtilen bölge kodunu kabul eder bilinen ccTLD'ye ("üst düzey alan") unicode bölgesi alt etiketi eşleme iki karakterli değerler sunmalıdır. Desteklenen bölgeler için Google Haritalar Platformu Kapsam Ayrıntıları'na bakın.

streetview modu

Haritalar Yerleştirme API'si, Street View görüntülerini kapsam alanındaki belirli konumlardan alınan etkileşimli panoramalar olarak görüntülemenize olanak tanır. Kullanıcıların katkıda bulunduğu Photosphere'ler ve Street View özel koleksiyonları da kullanılabilir.

Her Street View panoraması, tek bir konumdan 360 derecelik tam bir görünüm sunar. Resimler 360 derece yatay görünüm (tam çerçeve) içerir ve 180 derece dikey görünüm (en dümdüzden aşağıya doğru). İlgili içeriği oluşturmak için kullanılan streetview modu, sonucu oluşturan bir görüntüleyici sağlar merkezinde kamera bulunan küre şeklinde bir panorama oluşturun. Yakınlaştırmayı ve kameranın yönünü kontrol etmek için kamerayı hareket ettirebilirsiniz.

Aşağıdaki streetview modu panoramasına bakın:

https://www.google.com/maps/embed/v1/streetview
  ?key=YOUR_API_KEY
  &location=46.414382,10.013988
  &heading=210
  &pitch=10
  &fov=35

Aşağıdaki URL parametrelerinden biri gereklidir:

  • location, virgülle ayrılmış enlem ve boylam değerlerini kabul eder değerleri (46.414382,10.013988). API, panoramayı gösterir. bu konuma en yakın zamanda fotoğrafı çekildi. Street View görüntüleri düzenli olarak yenilenir ve fotoğraflar biraz farklı şekillerde çekilebilir. her seferinde farklı bir konuma sabitlenebilir. görüntü güncellendiğinde panoramanıza bir göz atalım.

  • pano belirli bir panorama kimliğidir. Bir pano belirtirseniz location da belirtebilirsiniz. İlgili içeriği oluşturmak için kullanılan location yalnızca API panoramayı bulamazsa kullanılır Kimlik.

Aşağıdaki URL parametreleri isteğe bağlıdır:

Parametre Tür Açıklama Kabul edilen değerler
heading İsteğe bağlı Kameranın pusula yönünü saat yönünde derece olarak gösterir geliştiriyor. -180 ile 360° arasındaki derece cinsinden değer
pitch İsteğe bağlı kameranın yukarı veya aşağı açısını belirtir. Pozitif değerler kamera açısını yukarı, negatif değerler de kamera açısını aşağı doğru döndürür. İlgili içeriği oluşturmak için kullanılan varsayılan 0° perdesi, bu çekim sırasında kameranın konumuna göre resim çekildi. Bu nedenle, 0° eğim genellikle (ancak her zaman değil) yataydır. Örneğin, bir tepede çekilen bir resimde yatay olmayan bir varsayılan eğim gösterilir. -90° ile 90° arasında derece cinsinden değer
fov İsteğe bağlı resmin yatay görüş alanını belirler. Varsayılan olarak 90°'tır. Sabit boyutlu bir görüntü alanıyla çalışırken, daha küçük sayılar daha yüksek bir yakınlaştırma düzeyini belirtecek şekilde yakınlaştırma düzeyi olarak görüntü alanı düşünülebilir. 10° - 100° aralığında derece cinsinden değer
center İsteğe bağlı Harita görünümünün merkezini tanımlar. Virgülle ayrılmış enlem ve boylam değerlerini kabul eder, örneğin: 37.4218,-122.0840
zoom İsteğe bağlı Haritanın ilk yakınlaştırma düzeyini ayarlar. 0 (tüm dünya) ile 21 arasında değişen değerler (bağımsız binalar). Üst sınır, seçilen konumda bulunan harita verilerine bağlı olarak değişebilir.
maptype İsteğe bağlı Yüklenecek harita karolarının türünü tanımlar. roadmap (varsayılan) veya satellite
language İsteğe bağlı Kullanıcı arayüzü öğeleri ve görüntülenmesi için kullanılacak dili tanımlar etiketleri kullanabilirsiniz. Varsayılan olarak, ziyaretçiler bir haritayı kendi başlarına görür dili'ne dokunun. Bu parametre yalnızca bazı ülke parçaları için desteklenir; eğer istenen dil karo grubu için desteklenmiyorsa o parça kümesi için varsayılan dil kullanılacak.
region İsteğe bağlı Coğrafi-politik hassasiyetlere göre görüntülenecek uygun sınırları ve etiketleri tanımlar. İki karakterli (sayısal olmayan) olarak belirtilen bölge kodunu kabul eder bilinen ccTLD'ye ("üst düzey alan") unicode bölgesi alt etiketi eşleme iki karakterli değerler sunmalıdır. Desteklenen bölgeler için Google Haritalar Platformu Kapsam Ayrıntıları'na bakın.

search modu

Search modu, görünür harita bölgesindeki bir aramanın sonuçlarını gösterir. Arama terimine bir konum (record+stores+in+Seattle) ekleyerek veya aramayı sınırlamak için bir center ve zoom parametresi ekleyerek arama için bir konum tanımlanması önerilir.

https://www.google.com/maps/embed/v1/search
  ?key=YOUR_API_KEY
  &q=record+stores+in+Seattle

Aşağıdaki parametreleri kullanabilirsiniz:

Parametre Tür Açıklama Kabul edilen değerler
q Zorunlu Arama terimini tanımlar. in+Seattle veya near+98033 gibi coğrafi kısıtlamalar içerebilir.
center İsteğe bağlı Harita görünümünün merkezini tanımlar. Virgülle ayrılmış enlem ve boylam değerlerini kabul eder, örneğin: 37.4218,-122.0840
zoom İsteğe bağlı Haritanın ilk yakınlaştırma düzeyini ayarlar. 0 (tüm dünya) ile 21 arasında değişen değerler (bağımsız binalar). Üst sınır, seçilen konumda bulunan harita verilerine bağlı olarak değişebilir.
maptype İsteğe bağlı Yüklenecek harita karolarının türünü tanımlar. roadmap (varsayılan) veya satellite
language İsteğe bağlı Kullanıcı arayüzü öğeleri ve görüntülenmesi için kullanılacak dili tanımlar etiketleri kullanabilirsiniz. Varsayılan olarak, ziyaretçiler bir haritayı kendi başlarına görür dili'ne dokunun. Bu parametre yalnızca bazı ülke parçaları için desteklenir; eğer istenen dil karo grubu için desteklenmiyorsa o parça kümesi için varsayılan dil kullanılacak.
region İsteğe bağlı Coğrafi-politik hassasiyetlere göre görüntülenecek uygun sınırları ve etiketleri tanımlar. Bilinen ccTLD ("üst düzey alan") iki karakterli değerleriyle eşleşen iki karakterli (sayısal olmayan) bir unicode bölge alt etiketi olarak belirtilen bir bölge kodunu kabul eder. Desteklenen bölgeler için Google Haritalar Platformu Kapsam Ayrıntıları'na bakın.

Yer kimliği parametreleri

Maps Embed API, bir Yer adı veya adresi. Yer kimlikleri benzersiz ve kalıcı bir yeri tanımlayabilirsiniz. Daha fazla bilgi için Google Places API belgelerini inceleyin.

Maps Embed API aşağıdaki URL için yer kimliklerini kabul eder parametre:

  • q
  • origin
  • destination
  • waypoints

Yer kimliği kullanmak için önce place_id: önekini eklemeniz gerekir. Aşağıdaki kodda, yol tarifi isteğinin başlangıç noktası olarak New York Belediye Sarayı belirtilmiştir: origin=place_id:ChIJs--MqP1YwokRBwAhjXWIHn8.

  • radius, belirli bir enlem ve boylama odaklı bir panorama aramak için metre cinsinden belirtilen bir yarıçapı ayarlar. Geçerli değerler sıfırdan büyük tam sayılardır. Varsayılan değer 50'dir.

  • source, Street View aramalarını seçili kaynaklarla sınırlandırır. Geçerli değerler şunlardır:

    • default, Street View için varsayılan kaynakları kullanır; aramalar belirli kaynaklarla sınırlı değildir.
    • outdoor, aramaları açık hava koleksiyonlarıyla sınırlandırır. İç mekan koleksiyonlar arama sonuçlarına dahil edilmez. Dış mekan panoramalarının belirtilen yer için mevcut olmayabilir. Ayrıca yalnızca bu aşamada olan içeride olup olmadıklarının belirlenmesinin mümkün olduğu panoramalar döndürür. üretebiliriz. Örneğin, PhotoSpheres bilinmediğinden döndürülmüyor kolayca inceleyebiliyorlar.