Locator Plus uygulama kılavuzu

Genel Bakış

web iOS API

Google Haritalar Platformu; web (JS, TS), Android ve iOS için ve yerler, yol tarifleri ve Google'dan hakkında bilgi edinmek için web hizmetleri API'leri görebilirsiniz. Bu kılavuzdaki örnekler bir platform için yazılmıştır ancak belge bağlantıları diğer platformlarda uygulanmak üzere sağlanmıştır.

Hemen oluşturun!

Hızlı Oluşturucu her şeyi tek bir yerden içe aktarma da dahil olmak üzere hızlı bir şekilde bir bulucu İşletme Profili girişleri ve üçüncü taraf sağlayıcılar. Etkileşimli kullanıcı arayüzü sayesinde kod oluşturup Cloud'a katılabilirsiniz.

Kullanıcılarınız ürün ve hizmetleri internette araştırmak ve en iyi ve en iyi randevu almak veya sipariş almak için uygun bir konum belirleyin. Konumunuza mümkün olduğunca hızlı ulaşmak istiyorlar ve fiziksel konumlarınıza yapılan ziyaretleri artıran zengin çevrimiçi deneyimler ve kullanıcı memnuniyetini güçlendirmek ve destek aramalarını azaltmak. Ayrıca bu riskleri belirlemek için bulma aracınızın başarısını ölçer. ve nerelerde iyileştirme yapabileceğinizi bilmek istiyorsanız.

Locator Plus: Bu rehberde sağladığımız rehberlik ve özelleştirme ipuçları Google Haritalar Platformu'nun ideal kombinasyonu olarak önerdiğimiz Mükemmel konum bulma aracı kullanıcı deneyimleri oluşturmaya yönelik API'ler. Bu uygulamaları izleyerek konumlarınızı harita üzerinde bulmalarına yardımcı olabilir, eklemek için ihtiyaç duydukları onlara yol göstermek isterlerse arabayla, hatta araba kullanırken bisikletle, yürüyerek veya toplu taşımayla seyahat.

Locator Plus kullanıcılarının analizlerini analiz etmek için kullandıkları analiz kontrol paneli Böylece, alışveriş yapan kullanıcıların ürün veya hizmetlerinizle ne kadar iyi mağaza bulma aracınızla. Bu rapora erişmek için şuraya gidin: Etkileşim Raporları bölümü hoş geldiniz. Bu raporla ilgili daha fazla bilgi için bkz. Etkileşim raporları.

Aşağıdaki şemada, Locator Plus'ın uygulanmasıyla ilişkili temel API'ler gösterilmektedir. Diyagramda, konum verilerinizi kullanarak birleştirebileceğiniz bir veritabanı da gösterilir. Kullanıcılara en iyi, en kapsamlı görünüm setini sunmak için bilgi sağlar. (Büyütmek için tıklayın.)

Web tarayıcısı, diyagramın sol tarafında Yer Ayrıntıları pop-up'ının yer aldığı bir harita gösterir. Diyagramın sağ tarafında, farklı işlevler sunan API'lerin listesi: Konum görselleştirme ve içerik, harita stili, harita için Maps JavaScript API Street View görüntülerini ve rotaları görüntüleme özelliğini kullanabilirsiniz. Otomatik Yer Tamamlama özelliği için: adres tamamlama ve önceden yazma işlevlerine sahiptir. Yerler ve Coğrafi Kodlama API'leri adres konumu. Mesafe Matrisi API'si ile konumları mesafe, süre ve yardımcı olur. Seyahat süresine ve ulaşım moduna göre bir rota göstermek için Directions API. Diyagramın ortasında, özel konum veri noktalarını temsil eden bir veri deposu simgesi veri okuma ve yazma işlemini gösteren çift başlı okla gösterilen bir web sunucusu simgesi web sunucusu ile veri deposu arasında. Web tarayıcısı arasındaki oklar üzerinden geçmektir.

API'ler etkinleştiriliyor

Bu uygulamaları uygulamak için Google Cloud Console: ziyaret edin. Kurulum hakkında daha fazla bilgi için Google Haritalar Platformu'nu kullanmaya başlama.

Uygulama bölümleri

Aşağıda, bu konuda ele alacağımız uygulamalar ve özelleştirmeler verilmiştir.

  • . Onay işareti simgesi temel uygulamalardan biridir.
  • . Yıldız simgesi isteğe bağlıdır ancak çözümü geliştirir.
Konumlarınızı etkileşimli haritada gösterme

Kullanıcıların konum ayrıntılarını görmesine, etrafta gezinmesine, yakınlaştırma ve uzaklaştırmasına olanak tanıyan bir harita oluşturun.

Dilerseniz Quick Builder Locator Plus çözümü Google Haritalar'ı kullanarak işletme bilgilerinizi otomatik olarak İşletme Profili giriş yapma, randevu rezervasyon bağlantılarını yerleştirme ve Google Cloud Storage'a dağıtım yapma.

Yer Ayrıntılarını Sağlama Kullanıcılar en yakın konumunuzu harita üzerinde bulduktan sonra onlara anlamlı teklifler verin Yer Karar vermelerine yardımcı olmak için konumlarla ilgili Ayrıntılar.
Konumlar 45° açıyla gösteriliyor Kullanıcılara 45 derecelik açıyla uydu görünümünde konumunuzu daha iyi gösterin.
Kullanıcılarınızın konumunu belirleme Tüm platformlarda kullanıcı deneyimini iyileştirmek için "kullandıkça yaz" işlevi ekleyin. Adres doğruluğunu en az tuş vuruşlarıyla artırma
En yakın konumlara seyahat süresi ve mesafe gösteriliyor Birden fazla kalkış ve varış noktası için seyahat mesafesini ve seyahat süresini hesaplayabilirsiniz. isteğe bağlı olarak yürüyüş, araba, araba yolculuğu gibi çeşitli ulaşım şekillerini belirtmek veya bisiklete binmeyi seçebilirsiniz.
Kullanıcıların randevu almasına yardımcı olma

Kullanıcıların Yer Ayrıntıları yan panelinden randevu almasına izin verin.

Dilerseniz Quick Builder Locator Plus çözümü Google Haritalar'ı kullanarak işletme bilgilerinizi otomatik olarak İşletme Profili giriş yapma, randevu rezervasyon bağlantılarını yerleştirme ve Google Cloud Storage'a dağıtım yapma.

Yerel teklifleri gösterme Yer Ayrıntıları yan panelinde kullanıcılara tıklanabilir yerel teklifler gösterin.
Navigasyon yol tarifi sağlama Çeşitli ulaşım biçimlerini kullanarak kalkış noktasından hedefe yol tarifi verileri alın araba kullanma, bisiklete binme ve toplu taşıma gibi araçlar kullanılır.
Haritanızı özelleştirme Konumlarınızın göze çarpmasına yardımcı olmak için özel harita işaretçileri oluşturun ve haritayı eşleştirmeye karar verin. Belirli önemli yerleri (ÖY) şurada görüntüleyin (veya gizleyin) kullanıcıların kendilerini daha iyi tanımalarına ve ÖY yoğunluğunu kontrol etmelerine yardımcı olmak için haritanızı harita karmaşasını önler.
Analizlerle kullanım analizleri elde etme Konum bulma stratejiniz hakkında detaylı bilgi edinmek için Google Analytics'i yapılandırın ve kullanın ele alacağız.
Mobil cihaza yol tarifi gönderme Bulucu üzerinde yol tariflerini göstermenin yanı sıra, aynı zamanda bir Hareket halindeyken Google Haritalar'ı kullanarak navigasyon için kullanıcının telefonunu.
Kullanıcıların konumları görselleştirmesine yardımcı olmak için Street View'ı gösterme Kullanıcılara 360 derece görünüm içeren Street View görüntüleri sunarak onları daha iyi yönlendirmek ve konumlarınızı daha hızlı bulmalarına yardımcı olabilirsiniz.
Coğrafi Konum ile kullanıcı konumunu belirleme Cihaz içi konum hizmetlerini kullanmak istemiyorsanız Kullanıcının konumunu belirlemeye yardımcı olan coğrafi konum.
Özel konum verilerini Yer Ayrıntılarıyla birleştirme Kendi özel konum ayrıntılarınızı Yer Ayrıntılarıyla birleştirme Böylece kullanıcılara karar vermeleri için zengin bir veri kümesi sunar.

Konumlarınızı etkileşimli haritada gösterme

Bulucu, kullanıcı deneyiminin önemli bir parçasıdır. Bununla birlikte, bazı sitelerde yakındaki bir yeri bulmak için siteden veya uygulamadan ayrılmalarını gerektiren basit bir harita bile konum. Bu durumda da gereken bilgileri almak için sayfalar arasında gezinebilir. Bunun yerine, özelleştirerek bu deneyimi en üst düzeye çıkarın.

Bunu etkinleştirmenin birkaç yolu vardır: (1) Quick Builder Locator Plus çözümü Bu işlevselliği kullanıma hazır bir şekilde sunmak ve (2) kendi Dinamik Haritalar uygulamanızı kullanmak. Bu bölümde bu seçenekler ayrıntılı olarak açıklanmaktadır.

Quick Builder Locator Plus'ı kullanma

URL parametrelerinin Google tarafından nasıl ele alınmasını istediğinizi belirtmek için Quick Builder Locator Plus çözümü simgesini tıklayın. Şimdi, şirket düzeyinde İşletme Profilinizin ayrıntıları, web sitenizdeki mağaza bulma aracına yansıtılacaktır. Bu değişiklikler arasında çalışma saatleri, iletişim bilgileri, fotoğraflar, hizmet seçenekleri ve daha fazlası yer alabilir. Quick Builder, bir harita üzerinde işletme yerlerini hızlı bir şekilde belirlemenizi sağlar, dağıtılabilir kod oluşturabilir veya dakikalar içinde doğrudan Google Cloud Storage'a dağıtabilirsiniz.

İşletme Profili entegrasyonu
Konumlarınızı Locator Plus'ta kolayca yönetmek için İşletme Profilinizden işletme bilgilerini içe aktarma

Cloud'a dağıtma
Google Cloud'u kullanarak Locator Plus çözümünüzü kolayca dağıtın

Kendi Dinamik Haritalar uygulamanızı kullanma

Bu örnekte şunlar kullanılmaktadır: Maps JavaScript API Sunulan diğer seçenekler: Android | iOS

Sayfanıza dinamik harita (kullanıcıların içinde gezinebilecekleri bir harita) eklemek yakınlaştırabilir, uzaklaştırabilir ve farklı konumlar ve yerler hakkında ayrıntılı bilgi edinebilirsiniz birkaç satır kodla yapılabilir.

Öncelikle, sayfaya Maps JavaScript API'yi eklemeniz gerekir. Bu işlem, aşağıdaki komut dosyasını HTML sayfanızda bağlayarak yapılır. 

<script defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&solution_channel=GMP_guides_locatorplus_v2_a"></script>

URL, sayfa etkinken çalışan JavaScript initMap işlevine başvuruda bulunuyor yükler. URL'de ayrıca, haritanız için doğru şekilde biçimlendirildiğinden emin olmak amacıyla, istediğiniz dil tam olarak istediğiniz ülkeyi seçin. Bölge ayarlamak, ilgili davranışın ABD dışında kullanılan uygulamalar, belirlediğiniz bölgeye göre eğilim gösterir. Görüntüleyin Google Haritalar Platformu Kapsamıyla İlgili Ayrıntılar desteklenen diller ve bölgelerin tam listesini gözden geçirin ve region hakkında daha fazla bilgi edinin.

Ardından, haritanızı sayfaya yerleştirmek için bir HTML div koduna ihtiyacınız vardır. Burası haritanın görüntüleneceği yer. 

<div id="map"></div>

Sonraki adım, haritanızın temel işlevselliğini ayarlamaktır. Bu işlem Komut dosyası URL'sinde initMap komut dosyası işlevi belirtildi. Bu komut dosyasında aşağıdaki örnekte gösterildiği gibi, ilk konumu; harita türünü ve Harita üzerinde kullanıcılarınızın hangi denetimleri kullanabileceğini belirleyin. Not: getElementById(), "harita"yı referans alıyor div kimliği yukarıda. 

function initMap() {
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 12,
    center: { lat: 51.485925, lng: -0.129500 },
    zoomControl: false
  });
}

Bir bulucu için, genellikle ilk konumu, merkezi yakınlaştırma düzeyi (haritanın ilgili konuma ne kadar yakınlaştırıldığı). En sık kontrollerin ayarlanması gibi diğer unsurlar, kontrollerin kontrol edilmesi haritayla etkileşiminizi güçlendirir.

Yer kimlikleri alınıyor

Bu örnekte şunlar kullanılmaktadır: Places API Sunulan diğer seçenekler: JavaScript

Konumlarınızın adları ve benzeri temel bilgileri içeren bir veritabanına sahip olabilirsiniz. konumu, adresi ve telefon numarası. Google Haritalar'ın kaydettiği bilgileri getirmek için Platformun bu yerle ilgili bilgileri, coğrafi koordinatlar ve kullanıcıların katkıda bulunduğu bilgiler veritabanınızdaki her bir konuma karşılık gelen yer kimliğini bulun. Şunları yapabilirsiniz: şuna çağrı yap: Places API Yer Arama'da Yer uç noktası bulun ve yalnızca place_id alanını istiyor. Aşağıda, Google Londra ofisi için yer kimliği: 

https://maps.googleapis.com/maps/api/place/findplacefromtext/json?input=google%20london&inputtype=textquery&fields=place_id&key=YOUR_API_KEY&solution_channel=GMP_guides_locatorplus_v2_a

Bu yer kimliğini saklayabilirsiniz eklemek ve yer hakkında bilgi istemek için etkili bir yöntem olarak kullanabilirsiniz. Aşağıdakiler Coğrafi kodlamak, Yer Ayrıntılarını almak ve yol tarifi istemek için yer kimliğini kullanmaya ilişkin talimatlar geri dönelim.

Konumlarınızın coğrafi kodlamasını yapma

Bu örnekte şunlar kullanılmaktadır: Coğrafi Kodlama API'si Sunulan diğer seçenekler: JavaScript

Konum veritabanınızda açık adresler bulunuyorsa ancak coğrafi koordinatlar yoksa Coğrafi Kodlama API'si kullanarak söz konusu adresin enlem ve boylam bilgisini başkalarını da kullanabilir. Sunucu tarafında adreslerinizin coğrafi kodlamasını yapabilirsiniz. enlemleri ve boylamları veritabanınızda saklamalı ve yenile en azından 30 günde bir.

Geocoding API'nin kullanılmasına ilişkin bir örnek Google Londra ofisi için döndürülen yer kimliğinin enlem ve boylamı: 

https://maps.googleapis.com/maps/api/geocode/json?place_id=ChIJVSZzVR8FdkgRTyQkxxLQmVU&key=YOUR_API_KEY&solution_channel=GMP_guides_locatorplus_v2_a

Konumlar haritaya ekleniyor

Bir sonraki adım, konumlarınızı haritaya eklemektir. Bu genellikle işaretçiler ancak haritada harita üzerinde yer tutma gibi, kullanabileceğiniz veriler katmanları arasında yer alır.

Konumunuzun enlem ve boylamını belirledikten sonra, konumunuzun enlem ve boylamını haritaya bir işaretleyici ekleyin: 

var marker = new google.maps.Marker({
    position: { lat: 51.493073, lng: -0.146550 },
    label:"A",
    title:"Location Name"
});

// To add the marker to the map, call setMap();
marker.setMap(map);

Birkaç işaretçi ile çok sayıda konumun konumunu birlikte görebilirsiniz.

Çok sayıda konum varsa işaretçi kümelemeyi kullanmayı düşünebilirsiniz. yardımcı program JavaScript Android veya iOS JavaScript mağaza bulucu GitHub örneğindeki işaretçi kümeleme örneğini burada bulabilirsiniz.

Yer Ayrıntıları Sağlama

Bu örnekte kullanılanlar: Haritalar JavaScript API'si Sunulan diğer seçenekler: API | Android | iOS

Kullanıcıların ziyaret etmeden önce bilmesi gereken Yer Ayrıntılarını paylaşabilirsiniz konumlarınız. Zengin Yer Ayrıntılarına Sahip iletişim bilgileri, çalışma saatleri, kullanıcı puanları, kullanıcı fotoğrafları ve geçici Böylece, kullanıcılarınız işletmenizi ziyaret ettiklerinde tam olarak nelerle karşılaşacaklarını bilirler. Places API'ye bir çağrı yaptıktan sonra, yanıtı bir bilgi penceresinde, web kenar çubuğunda ya da istediğiniz başka bir şekilde oluşturabilirsiniz.

Yer Ayrıntılarını istemek için konumlarınızın her birinin yer kimliğine ihtiyacınız vardır. Cihazınızın yer kimliğini almak için Yer kimliklerini alma konusuna bakın konum.

Yer Ayrıntılarını istemeyle ilgili videoları görmek için genişletin:

Çalışma saatlerini öğrenin

Kapanışları kontrol edin

Maliyetleri kontrol altına alın

Aşağıdaki örnekte Yer Ayrıntılarını almak için Yerler Kitaplığı, Maps JavaScript API kullanılmaktadır ve bunları bir InfoWindow'a ekleyin. Bu uygulama, Yalnızca kullanıcı, tüm konumlara ait ayrıntıları önceden getirmek yerine işaretçiyi kullanarak elde etmeye yardımcı olur. 

     
  const marker = new google.maps.Marker({
    map,
    position: { lat: 51.493073, lng: -0.14655 },
  });
  const request = {
    placeId: "ChIJVSZzVR8FdkgRTyQkxxLQmVU",
    fields: ["name", "formatted_address", "rating", "website"],
  };
  const infowindow = new google.maps.InfoWindow();
  const service = new google.maps.places.PlacesService(map);

  google.maps.event.addListener(marker, "click", function () {
    service.getDetails(request, (place, status) => {
      if (status === google.maps.places.PlacesServiceStatus.OK && place) {
        infowindow.setContent(
          "<div><strong>" +
            place.name +
            "</strong><br>" +
            place.formatted_address +
            "<br>" +
            "Rating: " +
            place.rating +
            " stars<br>" +
            place.website +
            "</div>"
        );

        infowindow.open(map, this);
      }
    });
  });

Konumlar 45° görünümden gösteriliyor

Bu örnekte kullanılanlar: Haritalar JavaScript API'si Sunulan diğer seçenekler: Android | iOS

Kullanıcılara konumunuzun havadan görünümünü sunmak, konum hakkında daha net bir fikir edinmelerine yardımcı olur. Böylece, aradıklarını daha kolay bulabilirler. Kullanıcı tek bir konum seçtiğinde daha fazla ayrıntı görmek için, yakınlaştırarak mevcut uydu görüntülerini görüntüleyebilirsiniz 45° açıyla görüntüler.

Aşağıdaki kod örneği, haritayı yüksek bir yakınlaştırma düzeyine, uyumlu bir harita türüne ve ve varsa 45° görüntü gösterecek bir yatırma açısı. 45° ile ilgili ayrıntılar görüntülerin kullanılabilirliği belgeleri inceleyin.

function seeDetail(location) {
  map.setCenter(location);
  map.setZoom(19);
  map.setMapTypeId(google.maps.MapTypeId.HYBRID);
  map.setTilt(45);
}

Orijinal harita görünümüne sıfırlanıyor

Kullanıcılar genellikle tek bir sayfanın ayrıntılı görünümü arasında geçiş yapmak Konum ve yakındaki çeşitli konumların özet görünümü. Bu işlemi kolaylaştırmak için harita etkileşimlerinde veya harita etkileşimleri sırasında ayrıntı görünümünden çıktığını algılaması için işleyici liste görünümündedir. Örneğin, zoom_changed map nesne kullanıcının ayrıntılı görünümden manuel olarak uzaklaştırdığını veya yakınlaştırma düzeyini güncelleyen başka bir işleve gidin. Bu örnekte, uzaklaştırma yapmak türü ile harita oluşturun ve yatırın.

let originalMapTypeId = google.maps.MapTypeId.ROADMAP;
map.addListener("zoom_changed", () => {
  const newZoom = map.getZoom()!;

  if (newZoom < 19) {
    map.setTilt(0);
    map.setMapTypeId(originalMapTypeId);
  }
});

Kullanıcınızın konumunu belirleme

Bu örnekte şunlar kullanılmaktadır: Haritalar JavaScript API'si Sunulan diğer seçenekler: Android | iOS

Herhangi bir bulucudaki diğer temel bileşen, kullanıcınızın başlangıç konumunu belirlemektir. Varsayılan olarak, istekte bulunmak için mobil konum hizmetlerini ve web tarayıcısı coğrafi konumunu kullanabilirsiniz kullanıcı izinlerini kullanarak başlangıç noktasını kullanıcının mevcut konumu olarak ayarlayabilirsiniz. Ancak kullanıcı bu izinleri reddedebilir veya başlangıç noktası olarak farklı bir konum ayarlamak isteyebilir.

Günümüz kullanıcıları, tüketicide önceden otomatik tamamlama özelliğine alışkındır sürümünü deneyebilirsiniz. Bu işlev, Mobil cihazlarda ve web'de Google Haritalar Platformu Rehber kitaplıkları. Kullanıcı yazarken Otomatik tamamlama, widget'ları kullanarak geri kalan alanları doldurur. Ayrıca transkriptinizi doğrudan Rehber kitaplıklarını kullanarak kendi otomatik tamamlama işlevinizi sunabilirsiniz.

Otomatik Yer Tamamlama kitaplığını sitenize eklemek için, sitenize birkaç sorgu parametrelerini Maps JavaScript API komut dosyası URL'sine gönderin. Sonraki örnek, ekleme libraries=places. 

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places&callback=initMap&solution_channel=GMP_guides_locatorplus_v2_a" defer></script>

Sonra, kullanıcı girişi için sayfanıza bir metin kutusu ekleyin. 

<input id="autocomplete" placeholder="Enter starting
      address, city, or zip code" type="text"></input>

Son olarak, Otomatik tamamlama hizmetini başlatmanız ve adlandırılmış metin kutusuna bağlamanız gerekir. Otomatik Tamamlama tahminlerini coğrafi kod türlerine yerleştir seçeneği, giriş alanınızı yapılandırır kullanıcıların istedikleri her şeyi girebilmesi için açık adresleri, mahalleleri, şehirleri ve posta kodlarını kabul etmek ve kökenini tarif eden spesifiklik düzeyine sahip olmalıdır. geometry iznini istemeyi unutmayın alanını, yanıt kullanıcının başlangıç konumunun enlem ve boylamını içerecek şekilde ayarlayın. Şunu kullanacağınız: bu harita koordinatlarını haritayı yeniden ortalamak ve konumlarınızın başlangıç noktası. 

  // Create the autocomplete object, restricting the search predictions to
  // geographical location types.
  const autocomplete = new google.maps.places.Autocomplete(
    document.getElementById("autocomplete"),
    { types: ["geocode"],
      componentRestrictions: {'country': ['gb']},
      fields: ['place_id', 'geometry', 'formatted_address'] }
  );
  // When the user selects an address from the drop-down
  // zoom to the select location and add a marker.
  autocomplete.addListener("place_changed", addUserLocation);
}

Bu örnekte, kullanıcı adresi seçtikten sonra, addUserLocation() işlevi yürütüldü. Bu, eşleşen sonucun geometrisini, kullanıcının konumunu alır ve ardından, ilgili konuma gidip bir işaretçi ekler. 

function addUserLocation() {
  // Get the place details from the autocomplete object.
  const place = autocomplete.getPlace();

  // Add a marker to the map.
  const marker = new google.maps.Marker({
          map: map
        });

  marker.setLabel("C");
  marker.setPosition(place.geometry.location);

  // Zoom the map to the marker.
  map.panTo(place.geometry.location);
  map.setZoom(12);
}

Böylece, kullanıcı ile belirli konumlar arasındaki ilişkiyi görebilirsiniz. aşağıdaki resimde gösteriliyor.

Yer eklemeyle ilgili adım adım açıklamalı videoları görmek için bunu genişletin Uygulamanız için otomatik tamamlama:

Web sitesi

Android uygulamaları

iOS uygulamaları

En yakın konumlara seyahat süresi ve mesafe gösteriliyor

Bu örnekte aşağıdakiler kullanılmaktadır: Mesafe Matrisi API'si Sunulan diğer seçenekler: Mesafe Matrisi Hizmeti, Maps JavaScript API

Kullanıcının konumunu öğrendikten sonra, bunu kendi konumlarınızın bulunduğu yerlerle karşılaştırabilirsiniz. hakkında bilgi edindiniz. Maps JavaScript API, bunu Mesafe Matrisi Hizmeti ile yaparak Kullanıcılarınız sürüş süresi veya yol ile kendileri için en uygun konumu seçer dokunun.

Bir kullanıcının yakınındaki konumları göstermek, konumlarınızın zaten olduğu anlamına gelir doldurulacağından emin olun. Kendi konum veritabanınızı kullanırken ama önemli olan, verilerin haritada kullanılabilecek biçimde olmasını sağlamaktır. (ör. GeoJSON), Veri Katmanı konusu.

Konum listesini düzenlemenin standart yolu, konumları mesafeye göre sıralamaktır. Genellikle bu mesafe, kullanıcının bulunduğu yere kadar olan düz çizgi kullanılarak hesaplanır, ancak bu, yanıltıcı olabilir. Düz bir çizgi geçilemez bir nehrin üzerinden veya trafiğin yoğun olduğu yollardan geçebilir başka bir konumun daha elverişli olabileceği bir zamanda Bu sizin için mesafesi bulunan birden fazla konum oluşturabilirsiniz.

Mesafe Matrisi Hizmeti, kalkış ve varış konumlarının bir listesini alarak ve yalnızca seyahat mesafesini değil, aynı zamanda aralarındaki zamanı da gösterir. Kullanıcıda, başlangıç noktası olduğu veya onların tercih ettikleri başlangıç noktası olduğuna göre, konumlardan biri olduğudur. Kalkış ve varış noktaları, koordinat çiftleri veya adres olarak belirtilebilir. ikincisi de hizmet çağrıldığında eşleştirilir. Mesafe Matrisini kullanarak 'i kullanabilirsiniz.

Aşağıdaki örnek, Mesafe Matrisi Hizmeti'ni çağırarak ve konum gibi bilgiler dahil edilir. Bu örnekte, harita merkezinden Londra'daki üç Google ofisine uzaklığı.

URL kodlaması hızlı referansı: %2C = , (virgül), %3A = : (iki nokta), ve %7C = | (dikey çizgi) şeklinde tanımlar. 

      https://maps.googleapis.com/maps/api/distancematrix/json?origins=51.493490%2C-0.097288
      &destinations=place_id%3AChIJVSZzVR8FdkgRTyQkxxLQmVU%7Cplace_id%3AChIJVSZzVR8FdkgR-HklrBMO0Hc%7Cplace_id%3AChIJ4abvVDwbdkgRDZVFR7A6Bcc
      &units=metric
      &mode=driving
      &key=YOUR_API_KEY
      &solution_channel=GMP_guides_locatorplus_v2_a

Kopyalayıp çalıştırabileceğiniz bir sürüm aşağıda verilmiştir: 

      https://maps.googleapis.com/maps/api/distancematrix/json?key=YOUR_API_KEY&origins=51.493490%2C-0.097288&destinations=place_id%3AChIJVSZzVR8FdkgRTyQkxxLQmVU%7Cplace_id%3AChIJVSZzVR8FdkgR-HklrBMO0Hc%7Cplace_id%3AChIJ4abvVDwbdkgRDZVFR7A6Bcc&units=metric&mode=driving&solution_channel=GMP_guides_locatorplus_v2_a

Hizmetten verilen asıl yanıt; eşleşen adreslerin, mesafelerin ve süreleri, aşağıdaki örnekte gösterilene benzer:

Örnek yanıtı görmek için genişletin:

{
    "destination_addresses": [
        "123 Buckingham Palace Rd, Victoria, London SW1W 9SH, UK",
        "1-13 St Giles High St, West End, London WC2H 8AG, UK",
        "6 Pancras Square, Kings Cross, London N1C 4AG, UK"
    ],
    "origin_addresses": [
        "Unnamed Road, London, UK"
    ],
    "rows": [
        {
            "elements": [
                {
                    "distance": {
                        "text": "4.5 km",
                        "value": 4540
                    },
                    "duration": {
                        "text": "15 mins",
                        "value": 924
                    },
                    "status": "OK"
                },
                {
                    "distance": {
                        "text": "5.0 km",
                        "value": 5043
                    },
                    "duration": {
                        "text": "17 mins",
                        "value": 1044
                    },
                    "status": "OK"
                },
                {
                    "distance": {
                        "text": "6.9 km",
                        "value": 6919
                    },
                    "duration": {
                        "text": "23 mins",
                        "value": 1357
                    },
                    "status": "OK"
                }
            ]
        }
    ],
    "status": "OK"
}

Aşağıdaki resimde, kalkış noktası (kırmızı işaretçi C) ve hedefler harita üzerinde gösterilmektedir:

Resimde, kullanıcının konumu kırmızı işaretçiyle birlikte bir şehir haritası gösteriliyor. ve etrafındaki konumları yeşil işaretçiler olarak görebilirsiniz.

Resimde de görüldüğü gibi, düz çizgi mesafesi ve rota mesafesi çoğu zaman farklılık gösterir bulunmaktadır.

Konum Düz Mesafe Trafik / Zaman açısından yol
Konum A 3,32 km 4,5 km / 15 dakika
Konum B 3,20 km 5,0 km / 17 dakika
Konum C 4,84 km 6,9 km / 23 dakika

B konumu mesafeye göre en yakın konum olsa da rota ve oraya ulaşma süresi daha uzun sürdüğünü lütfen unutmayın.

Bu isteği gönderdikten sonra yanıtları şu ölçüte göre sıralamak için eşleşmeyi işleyebilirsiniz: sürüş süresi süresidir. Bu tür bir fonksiyonun örneklerini bulucuda bulabilirsiniz codelab'ler hakkında daha fazla bilgi edinin.

Bu örnekte aşağıdakiler kullanılmaktadır: Maps JavaScript API Yol Tarifi Hizmeti Sunulan diğer seçenekler: Directions API doğrudan uygulamadan veya uzaktan Android ve iOS'te kullanım için bir web hizmeti sunucu proxy'si aracılığıyla

Yol tarifini kullanıcılara sitenizin veya uygulamalarınızın içinden göstermek, ve başka bir deyişle sitenizden uzaklaşmak zorunda kalırsınız. Böylece, veya haritadaki rakipleri görebilir. Ülkenin karbon salınımını da gösterebilirsiniz. ve belirli bir yolculuğun etkisini gösterebilir.

Yol Tarifi Hizmeti ayrıca sonuçları işlemenize ve harita üzerinde kolayca görüntüleyebilirsiniz.

Aşağıda, bir yol tarifi panelinin görüntülenmesi örneği gösterilmektedir. Daha fazla bilgi için örnek, bkz. Metinle Yol Tarifi Gösterme.

Google Haritalar'ın bu özellikleri hakkında daha fazla bilgi edinmek için Haritalar JavaScript API'si Dokümanları veya adım adım talimatlara codelabs ile bir bulucu oluşturun.

Kullanıcıların randevu almasına yardımcı olma

Kullanıcılar yan panelde konumunuzun Yer Ayrıntılarını görüntülediğinde tek bir düğmeyi tıklayarak randevu almanın kolaylığı aşağıdaki şekilde gösterilmektedir.

Bunu etkinleştirmenin birkaç yolu vardır: (1) Quick Builder Locator Plus çözümü bu işlevi kullanıma hazır bir şekilde sunmak ve (2) İşletme Profili. Bu bölümde bu seçenekler ayrıntılı olarak açıklanmaktadır.

Quick Builder Locator Plus'ı kullanma

URL parametrelerinin Google tarafından nasıl ele alınmasını istediğinizi belirtmek için Quick Builder Locator Plus çözümü Google Ads hesabınızdaki işletme bilgilerini İşletme Profili. Hızlı Oluşturucu aracına aktarıldıktan sonra, yerleştirilmiş kodları işletmenizin bulunduğu konumlar için sunulan randevu rezervasyon bağlantıları Google ile Rezervasyon. Bir Google hesabıyla ilişkili İşletme Profiliniz olmasa bile aşağıdakileri kullanabilirsiniz: Üçüncü taraflarla daha önce etkinleştirdiğiniz işletmeler için rezervasyon bağlantıları yerleştirmek üzere Hızlı Oluşturucu Google ile Rezervasyon üzerinden rezervasyon sağlayıcılar*.

Google ile Rezervasyon
Mağaza bulma aracınıza rezervasyon özellikleri ekleyin

*Google ile Rezervasyon özelliği, yalnızca işletmelerin desteklenen bir rezervasyon sağlayıcı . Google ile Rezervasyon'u kullanmak istiyor ancak şu anda bir Rezervasyon ile çalışmıyorsanız lütfen aşağıdaki adımları izleyerek sağlayıcınızı bu formu ve dokümanlar göz atmanızı öneririm. Henüz bir rezervasyon sağlayıcıyla çalışmıyorsanız Rezervasyonlar bölümünde uygun sağlayıcıları İşletme Profili Yöneticisi.

Randevu rezervasyonunu etkinleştirmek için İşletme Profili'ni kullanma

İnternetteki varlığınızı İşletme Profili işletme oluşturduğunuz konumlar, etkinleştirilecek Google Haritalar Platformu yer kimlikleriyle ilişkilendirilir İş verileriyle entegre bir harita işlevi görür.

Business Profile API'leri, randevu rezervasyonu gibi işlemler oluşturmanıza olanak tanır. ve uygulamalarınızda görünür, ancak bunu etkinleştirmek için aşağıda açıklandığı gibi bazı manuel adımlar gerekir.

Kullanıcılar yan panelde konumlarınızdan birinin Yer Ayrıntılarını görüntülediğinde randevu alabilmeleri için bir bağlantı sağlar. Bu bölümde bunun nasıl yapılacağı açıklanmaktadır.

  1. İçerik üretme Türün konumu için İşletme Profili API'leri placeActionLink APPOINTMENT, ONLINE_APPOINTMENT, veya DINING_RESERVATION. placeActionLink nesne olacaktır bağlantısını tıklayın. (Randevu işlemini daha önce oluşturduysanız bağlantısını tıklayın, sonraki adıma geçin.) İşte size başarılı bir müşteriden placeActionLinks.create POST işlemi:

    {
    "name": "locations/15899957830169237700/placeActionLinks/9c984be778a7ebbc",
    "providerType": "MERCHANT",
    "isEditable": true,
    "uri": "https://example.com/reservation-uri",
    "placeActionType": "DINING_RESERVATION",
    "createTime": "2021-05-01T01:17:41.609161Z",
    "updateTime": "2021-05-01T01:17:41.609161Z"
}

  2. Google Haritalar Platformu yer kimliğiyle ilişkili İşletme Profili konumunu bulun.

    Kullanıcılar Yer Ayrıntılarını gördüğünde bir Google Haritalar Platformu'nun ayrıntılarını da görürler. yer kimliği. Yer kimliği bir İşletme Profili yer kimliğiyle ilişkilendirildiğinden alınacak ve görüntülenecek harita yer kimliğine dayalı yer kimliğini bulmak oluşturduğunuz randevu alma bağlantısı. Aşağıdaki Business Profile API çağrılarını yapın:

    1. Projenizin hesaplarını listeleyin.
    2. Tüm konumları listeleyin bir hesaba kattık.
    3. Hesap konumlarında, LocationKey Google Haritalar Platformu yer kimliğini içerir. Bu kimliği, görüntülenen konumun yer kimliğini belirtir.

  3. Yer kimliğini kullanarak istediğiniz işlem bağlantısını alabilirsiniz. Mevcut bir placeActionLink randevusu, mevcutları listele placeActionLinks değerini seçin ve şunun için filtreleyin: placeActionType bulmak istediğiniz randevu bağlantısını (APPOINTMENT, ONLINE_APPOINTMENT veya DINING_RESERVATION) olmalıdır.

    Aşağıdaki örnekte, yanıtta placeActionLink RANDEVU gösterilmektedir LIST çağrısından.

     {
   "placeActionLinks": [
       {
           "name": "locations/15899957830169237700/placeActionLinks/9c984be778a7ebbc",
           "providerType": "MERCHANT",
           "isEditable": true,
           "uri": "https://example.com/",
           "placeActionType": "APPOINTMENT",
           "createTime": "2021-05-01T01:17:41.609161Z",
           "updateTime": "2021-05-01T01:17:41.609161Z"
       }
   ]
 }
  4. Yan panelde bir <div> oluşturun ve placeActionLink nesnesini, özellikle de randevu alma bağlantısı.

Randevu bağlantıları eklemek için diğer alternatifler

Bir İşletme Profili yönetmiyorsanız veya Quick Builder Locator Plus çözümü, web sitesi veya uygulamadır. Bir diğer seçenek de Envanter yönetimi için Cloud Spanner (video).

Yerel teklifler gösteriliyor

Bir konumun Yer Ayrıntıları yan panelinde, kullanıcıların tıklayabileceği yerel teklifler gösterebilirsiniz. Google Benim İşletmem API'si "yayınlar" oluşturmanıza ve almanıza olanak tanır (ör. yerel teklifler) emin olmanız gerekir. Aşağıdaki şekilde bir yerel teklif örneği gösterilmektedir. Yer Ayrıntıları yan paneli.

(Önceki bölümde bulunan mimari diyagram (bulucunuza teklif eklemek için kullanılabilecek teknolojileri gösterir).

Yerel teklifler konumlarla ilişkili olduğundan İşletme Profili'ni konum kullanıcılarına ait Google Haritalar Platformu yer kimliğiyle ilişkilendirilen konum kimliği görüntülüyor. İşletme Profili yer kimliğiniz varsa ilgili teklifi Yer Ayrıntıları yan panelinizde gösterilecek localPost. Şu adımları uygulayabilirsiniz:

  1. Google Benim İşletmem API'si ile istediğiniz teklif yayınlarını oluşturun görüntü, türü OFFER.

  2. Haritada yer kimliğiyle ilişkili İşletme Profili konumunu / yer kimliğini bulun.

    Kullanıcılar Yer Ayrıntılarını gördüğünde bir Google Haritalar Platformu'nun ayrıntılarını da görürler. yer kimliği. Yer kimliği bir İşletme Profili yer kimliğiyle ilişkilendirildiğinden alınacak ve görüntülenecek harita yer kimliğine dayalı yer kimliğini bulmak Bulunduğunuz yerdeki yerel teklifin bağlantısını. Aşağıdaki Business Profile API çağrılarını yapın:

    1. birden fazla proje hesabı oluşturun.
    2. Tüm konum öğeleri gösterilir.
    3. Hesap konumlarında, LocationKey harita yer kimliğini içerir. Bu kimliği, söz konusu konumun yer kimliğiyle karşılaştırabilirsiniz görüntülendi.

    Aşağıda, İşletme Profili API'leri:

    https://mybusiness.googleapis.com/v4/accounts/111098884960588804666/locations/15899957830169237700

    Yanıtta, yer kimliği olan bir locationKey alanı var Google Haritalar Platformu istekleriyle kullanabilirsiniz.

    Örnek yanıtı görmek için genişletin.

          {
    "name": "accounts/111098884960588804666/locations/15899957830169237700",
    "locationName": "Sushi Sushi",
    "primaryPhone": "+49 2222 22222",
    "primaryCategory": {
        "displayName": "Restaurant",
        "categoryId": "gcid:restaurant",
    },
    "regularHours": {
        "periods": [
            {
                "openDay": "MONDAY",
                "openTime": "09:00",
                "closeDay": "MONDAY",
                "closeTime": "09:10"
            },
            {
                "openDay": "TUESDAY",
                "openTime": "11:30",
                "closeDay": "TUESDAY",
                "closeTime": "24:00"
            }
        ]
    },
    "locationKey": {
        "placeId": "ChIJs4wtL04X2jERbc8qHd_wZzk",
        "requestId": "2c72cbcb-ea2e-4d66-b684-0ef5f090300c"
    },
    "latlng": {
        "latitude": 1.3670033,
        "longitude": 103.8556385
    },
    "openInfo": {
        "status": "OPEN",
        "canReopen": true
    },
    "locationState": {
        "isGoogleUpdated": true,
        "canUpdate": true,
        "canDelete": true,
        "isVerified": true,
        "isPublished": true,
        "canHaveFoodMenus": true
    },
    "attributes": [
        {
            "attributeId": "has_delivery",
            "valueType": "BOOL",
            "values": [
                false
            ]
        },
        {
            "attributeId": "requires_masks_customers",
            "valueType": "BOOL",
            "values": [
                true
            ]
        },
        {
            "attributeId": "url_order_ahead",
            "valueType": "URL",
            "urlValues": [
                {
                    "url": "https://example.com/"
                },
            ]
        },
        {
            "attributeId": "pay_credit_card_types_accepted",
            "valueType": "REPEATED_ENUM",
            "repeatedEnumValue": {
                "setValues": [
                    "visa"
                ],
                "unsetValues": [
                    "american_express"
                ]
            }
        }
    ],
    "address": {
        "regionCode": "SG",
        "languageCode": "en-US",
        "postalCode": "560445",
        "addressLines": [
            "445 Ang Mo Kio Ave 10"
        ]
    },
    "profile": {
        "description": "Example restaurant"
    }
}

  3. Yer kimliğini öğrendiğinize göre artık istediğiniz teklifi alabilirsiniz. Bir mevcut teklifi yayınlayın, konum için mevcut localPosts listesini listeleyin ve filtreleyin topicType/OFFER için fırsat içeriğini bulun seçin.

    Bir konumla ilgili etkin Yerel Yayınların listelenmesine yönelik örnek bir istek:

    https://mybusiness.googleapis.com/v4/accounts/111098884960588804666/locations/15899957830169237700/localPosts

    Aşağıdaki örnekte OFFER localPost gösterilmektedir tıklayın.

    Örnek yanıtı görmek için genişletin.

    {
    "localPosts": [
        {
            "name": "accounts/111098884960588804666/locations/15899957830169237700/localPosts/2524928563578730680",
            "languageCode": "en",
            "summary": "Buy One Get One Free on all order-ahead bento boxes today!",
            "state": "LIVE",
            "event": {
                "title": "Bento BOGO",
                "schedule": {
                    "startDate": {
                        "year": 2020,
                        "month": 1,
                        "day": 20
                    },
                    "startTime": {},
                    "endDate": {
                        "year": 2021,
                        "month": 1,
                        "day": 21
                    },
                    "endTime": {}
                }
            },
            "updateTime": "2020-09-11T10:56:22.594Z",
            "createTime": "2020-09-11T10:56:22.594Z",
            "searchUrl": "https://local.google.com/place?id=4156539623820808045&use=posts&lpsid=2524928563578730680",
            "media": [
                {
                    "name": "accounts/111098884960588804666/locations/15899957830169237700/media/localPosts/AF1QipOBQCIf40SbF_PPJxb_zvfCHmaTbv9Zw02PoYPS",
                    "mediaFormat": "PHOTO",
                    "googleUrl": "https://lh3.googleusercontent.com/p/AF1QipOBQCIf40SbF_PPJxb_zvfCHmaTbv9Zw02PoYPS"
                }
            ],
            "topicType": "OFFER",
            "offer": {
                "couponCode": "BOGO-JET-CODE",
                "redeemOnlineUrl": "https://www.example.com/redeem",
                "termsConditions": "Offer only valid for order-ahead orders placed online."
            }
        },
    ],
}
  4. Yan panelde bir <div> oluşturun ve ilgili verileri girin localPost nesnesinden.

Haritanızı özelleştirme

Haritanızın görünümünü ve ayrıntılarını çeşitli yöntemlerle değiştirebilirsiniz. Örneğin, şunları yapabilirsiniz:

  • Varsayılan harita raptiyelerinin yerine geçecek kendi özel işaretçilerinizi oluşturun.
  • Harita özelliklerinin renklerini markanızı yansıtacak şekilde değiştirin.
  • Gösterilecek önemli yerleri kontrol edin (turistik yerler, yemek, konaklama vb.) Böylece, hangi yoğunlukta olduğunu vurgular ve kullanıcıların dikkatini konumlarınıza odaklamanızı sağlar. Kullanıcıların en yakın konuma gitmelerine yardımcı olan önemli noktalar.

Özel harita işaretçileri oluşturma

İşaretçilerinizi, varsayılan rengi değiştirerek özelleştirebilirsiniz (genellikle bir konum açık olduğunda) veya işaretçiyi markanızın logosudur. Bilgi pencereleri veya pop-up pencereleri, ek bilgi sağlayabilir bilgiler de gösterebilir. Ayrıca transkriptinizi kafes, vektör, sürüklenebilir ve hatta animasyonlu özel işaretçiler oluşturabilirsiniz.

Aşağıda, özel işaretçilerin kullanıldığı örnek bir harita verilmiştir. (Kaynak koduna bakın: Maps JavaScript API özel işaretçileri konusu).

Ayrıntılı bilgi için JavaScript (web) Android ve iOS

Haritanızın stilini belirleme

Google Haritalar Platformu, haritanızı, kullanıcıların daha kolay bulacağı şekilde şekillendirmenize olanak tanır ulaşmak, mümkün olan en yakın zamanda oraya gitmek ve markanızı pekiştirmenize yardımcı olmaktır. Örneğin, harita renklerini markanıza uygun şekilde değiştirebilir ve daha kullanıcı tarafından görülebilen önemli yerleri kontrol ederek haritadaki dikkat dağıtıcı öğeleri içerir. Google Haritalar Platformu'nda sunulan bir dizi harita başlangıç şablonlarından bazılarını aşağıda görebilirsiniz. seyahat, lojistik, emlak ve perakende.

Google Cloud Console'da harita stillerini oluşturabilir veya değiştirebilirsiniz Projenizdeki Harita Stilleri sayfası.

Harita stili oluşturma ve stil oluşturma animasyonlarını Cloud Console:

Sektör haritası stilleri

Bu animasyon, kullanabileceğiniz sektöre özgü önceden tanımlanmış harita stillerini gösterir. Bu tarzların her sektör türü için en uygun başlangıç noktası olmasını sağlar. Örneğin, Perakende harita stili, haritadaki önemli yerleri azaltarak kullanıcıların mağazanıza odaklanmasını sağlar. konumları ve en yakın konuma kısa sürede ulaşmalarına yardımcı olacak önemli noktaları ve kendinden emin olmalısınız.

Harita Stili sayfasında, Yeni Harita Stili Oluştur&#39;u tıklanır. Yeni Harita Stili sayfasında fare ile her birinin yanındaki radyo düğmesini şu sektör için optimize edilmiş stiller: Seyahat, Lojistik, Gayrimenkul ve Perakende satış. Her bir düğme tıklandığında, harita stili açıklaması ve grafik değişiklikleri önizle.

Önemli yer kontrolü

Bu animasyon, önemli yerler için işaretçi rengini belirler ve harita stilindeki ÖY yoğunluğunu gösterir. Yoğunluk ne kadar fazla olursa ÖY işaretçileri haritada görünür.

Harita Stili sayfasında, Yeni Harita Stili Oluştur&#39;u tıklanır. Yeni Harita Stili sayfasında, Kendi Stilinizi Oluşturun altındaki Google Haritalar radyo düğmesi seçili olduğundan emin olun. Farenin, Atlas stili için Atlas radyo düğmesini tıklaması ve ardından Stil Düzenleyicide Aç’ı tıklıyorum. Stil Düzenleyici&#39;de farenin tıklandığı ardından Önemli Yerler özelliğini, ardından Simge öğesini tıklayıp kırmızıya çevirebilirsiniz. Ardından fare, ÖY Yoğunluğu onay kutusunu seçip slaytları yoğunluk kontrolünü sağa doğru kaydırın. Daha fazla kırmızı Yoğunluk arttıkça harita önizlemesinde işaretçiler belirir. Fare, hareket etmeye başlar. Kaydet düğmesine tıklayın.

Her harita stilinin kendi kimliği vardır. Cloud Console'da bir stil yayınladıktan sonra kodunuzda bu harita kimliğine referans verirsiniz. Bu, bir harita stilini gerçek zamanlı olarak güncelleyebileceğiniz Böylece uygulamanızı yeniden düzenlemeye gerek kalmaz. Yeni görünüm otomatik olarak şurada görünecektir: farklı platformlarda kullanılmasını sağlar. Aşağıdaki örneklerde Maps JavaScript API'yi kullanarak bir web sayfasına harita kimliği eklemek için.

Komut dosyası URL'sine bir veya daha fazla map_ids eklediğinizde Maps JavaScript API, daha hızlı harita için bu stilleri otomatik olarak kullanıma sunar oluşturma hakkında daha fazla bilgi edinin. 

<script
 src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&map_ids=MAP_IDs&callback=initMap&solution_channel=GMP_guides_locatorplus_v2_a">
</script>

Aşağıdaki kod, web sayfasında stilize edilmiş bir harita görüntüler. (Bir HTML kodu gösterilmez <div id="map"></div> öğenin page.) 

map = new google.maps.Map(document.getElementById('map'), {
  center: {lat: 51.485925, lng: -0.129500},
  zoom: 12,
  mapId: '1234abcd5678efgh'
});

Google Cloud'a bulut tabanlı harita stilleri ekleme JavaScript (web) Android, ve iOS

Analizlerle kullanım analizleri elde etme

Analizleri kullanarak, kullanıcıların web sitenizle nasıl etkileşime girdiği hakkında değerli bilgiler yer alır. Bu bölüm, Google Analytics'i yapılandırma ve izleme konusunda En çok ilgilendiğiniz verileri izlemek için İşletme Profili analizleri. Hızlı Oluşturucu İçin Locator Plus kullanıcıları, analizler elde etmenize ve bilgi üretmenize yardımcı olan Analytics kontrol paneli Anonimleştirilmiş verilere dayalı olarak site ziyaretçilerinizin mağaza bulma aracınızla ne kadar iyi etkileşimde bulunduğunu gösteren bir resim.

Locator Plus Analytics
Mağaza bulma aracı analizi kontrol paneli, performans metriklerinizi

Bu rapora erişmek için şuraya gidin: Cloud Console'un etkileşim raporları bölümünü inceleyin. Bu raporla ilgili daha fazla bilgi için bkz. etkileşim raporları

Google Analytics'in gücü ve esnekliği göz önünde bulundurulduğunda, size yardımcı olmak için ve kullanım bilgilerini ekleyebilirsiniz. Bunun yerine sizi proje yönetimiyle ilgili önemli belgelere daha ayrıntılı okumalar ve talimatlar alırken, analiz için göz önünde bulundurulması gereken önemli noktaları vurgular. uygulamanızı indirin.

Google Analytics'i Kurma

Uygulamanızla birlikte Google Analytics'i zaten kullanıyorsanız bu bölümü atlayabilirsiniz.

Aşağıda, Google'ı etkinleştirmek için sitenize yapıştıracağınız bir "Global Etiket" örneği verilmiştir. Analiz.

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/
gtag/js?id=G-XR5B5D4NW0"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'G-XR5B5D4NW0');
</script>
.

İster Google Etiket Yöneticisi'ni kullanın, ister Google Analytics'i doğrudan sitenize ekleyin, temel olan, aşağıdakileri yapmak için Google Analytics uygulamanızı nasıl kullanacağınızı anlamaktır:

  • Web sitesinden bağımsız olarak ölçülebilen ve tıklamalar gibi kullanıcı etkileşimlerini tetikleme Sayfa görüntülemeler (etkinlikler).
  • Ham verileri göster (metrikler) gruplar halinde (boyutlar) veya özel boyutlar) ekleyebilirsiniz.

Özel etkinlikleri kullanma

Aşağıda, bulucunuzda özel etkinlik tanımlamaya ilişkin bir örnek verilmiştir:

gtag('event', 'location', {
  'method': 'address'
});

event ve method öğelerini yeterince açık bir şekilde adlandırmanız önemlidir Böylece raporlamadaki etkinlikleri anlayabilirsiniz. Belirli bir anahtar kelime için ölçmek istediğiniz etkileşimleri (ör. kullanıcı, Aşağıdaki şekilde gösterilen Otomatik tamamlama açılır listesi.

Aşağıdaki izleme çağrısını, etkinliği kullanan Google Analytics'e gönderebilir ve yöntemidir. (Okuma kolaylığı için her sorgu parametresini ayrı bir satırda göstereceğiz.)

https://www.google-analytics.com/g/collect?v=2
&tid=G-XR5B5D4NW0
>m=2oe550
&_p=64678170
&sr=1920x1200
&ul=fr
&cid=489856786.1598861364
&_s=2
&dl=http%3A%2F%2.storelocator.html
&dt=Store%20Locator
&sid=1620827159
&sct=1
&seg=1
&en=location
&_et=6032
&ep.method=address

Aşağıdaki şekilde, Google Analytics çağrısının tarayıcının Denetle komutunda nasıl göründüğü gösterilmektedir Ağ sekmesinde görünür. (Büyütmek için tıklayın).

Özel etkinlik etiketlerinizin düzgün bir şekilde yakalandığını doğrulamak için "Anlık" Google Analytics'te görüntüleyin. Örneğin, "location" etkinlik için daha önce Yer Otomatik Tamamlama, Google Analytics'te aşağıdaki resimlerde gösterildiği gibi görünür.

 

Alternatif olarak, şurada gösterildiği gibi DebugView'u kullanarak gerçek zamanlı etkinlikleri izleyebilirsiniz: tıklayın. Tam Etkinlikler raporuna erişmek için 24 saat beklemeniz gerektiğini unutmayın. Etkileşim > Etkinlikler bölümünde bulabilirsiniz.

Ayrıca, fiziksel mağazanıza daha fazla yaya trafiği çekmek için stratejiler geliştirip ölçebilirsiniz. daha fazla bilgi bulabilirsiniz. Örneğin, Google Analytics'te Mağaza ziyaretleri fiziksel bağlantıları kullanan mağaza ziyaretleri analytics'i (Google Ads tarafından ölçülmüş) bulucu analizinize ekleyin. Ayrıca, kendi becerilerinizi fiziksel konumlarınızda kullanılabilecek online teklifler gibi kendi uygulamadan konuma stratejileriniz olabilir.

İşletme Profili metrikleri

İlgilendiğiniz etkinlikleri, metrikleri ve boyutları izlemenin yanı sıra, Google Analytics, İşletme Profili'nin kendi metrikleri de vardır. Örneğin, bulucunuza randevu rezervasyonu ve yerel teklif bağlantıları eklerseniz şunları yapabilirsiniz: görüntüleme ve tıklamalarla ilgili metrikler alabilirsiniz.

Business Profile API'lerine yapılan aşağıdaki örnek istekte birden fazla tür için istekte bulunulur. kullanabilirsiniz. Teklif tıklamalarını izlemek için LOCAL_POST_VIEWS_SEARCH ve LOCAL_POST_ACTIONS_CALL_TO_ACTION metrikleri en alakalı metrik olacaktır.

Örnek isteği görmek için genişletin.

POST https://mybusiness.googleapis.com/v4/accounts/111098884960528804666/locations:reportInsights
Body:
{
 "locationNames": [
   "accounts/111098884960528804666/locations/15899957830169237700"
 ],
 "basicRequest": {
         "metricRequests": [
            {
              "metric": "QUERIES_DIRECT"
            },
            {
              "metric": "QUERIES_INDIRECT"
            },
            {
              "metric": "VIEWS_MAPS"
            },
            {
              "metric": "VIEWS_SEARCH"
            },
            {
                "metric": "ACTIONS_DRIVING_DIRECTIONS"
            },
            {
                "metric": "LOCAL_POST_VIEWS_SEARCH"
            },
            {
                "metric": "LOCAL_POST_ACTIONS_CALL_TO_ACTION"
            }
         ],
         "timeRange": {
              "startTime": "2021-01-01T01:01:23.045123456Z",
              "endTime": "2021-04-30T23:59:59.045123456Z"
         }
   }
}

Örnek yanıtı görmek için genişletin.

{
   "locationMetrics": [
       {
           "locationName": "accounts/111098884960528804666/locations/15899957830169237700",
           "timeZone": "Asia/Singapore",
           "metricValues": [
               {
                   "metric": "QUERIES_DIRECT",
                   "totalValue": {
                       "metricOption": "AGGREGATED_TOTAL",
                       "timeDimension": {
                           "timeRange": {
                               "startTime": "2021-01-01T01:01:23.045123456Z",
                               "endTime": "2021-04-30T23:59:59.045123456Z"
                           }
                       },
                       "value": "82"
                   }
               },
               {
                   "metric": "QUERIES_INDIRECT",
                   "totalValue": {
                       "metricOption": "AGGREGATED_TOTAL",
                       "timeDimension": {
                           "timeRange": {
                               "startTime": "2021-01-01T01:01:23.045123456Z",
                               "endTime": "2021-04-30T23:59:59.045123456Z"
                           }
                       },
                       "value": "1493"
                   }
               },
               {
                   "metric": "VIEWS_MAPS",
                   "totalValue": {
                       "metricOption": "AGGREGATED_TOTAL",
                       "timeDimension": {
                           "timeRange": {
                               "startTime": "2021-01-01T01:01:23.045123456Z",
                               "endTime": "2021-04-30T23:59:59.045123456Z"
                           }
                       },
                       "value": "1571"
                   }
               },
               {
                   "metric": "VIEWS_SEARCH",
                   "totalValue": {
                       "metricOption": "AGGREGATED_TOTAL",
                       "timeDimension": {
                           "timeRange": {
                               "startTime": "2021-01-01T01:01:23.045123456Z",
                               "endTime": "2021-04-30T23:59:59.045123456Z"
                           }
                       },
                       "value": "631"
                   }
               },
               {
                   "metric": "ACTIONS_DRIVING_DIRECTIONS",
                   "totalValue": {
                       "metricOption": "AGGREGATED_TOTAL",
                       "timeDimension": {
                           "timeRange": {
                               "startTime": "2021-01-01T01:01:23.045123456Z",
                               "endTime": "2021-04-30T23:59:59.045123456Z"
                           }
                       },
                       "value": "3"
                   }
               },
               {
                   "metric": "LOCAL_POST_ACTIONS_CALL_TO_ACTION",
                   "totalValue": {
                       "metricOption": "AGGREGATED_TOTAL",
                       "timeDimension": {
                           "timeRange": {
                               "startTime": "2021-01-01T01:01:23.045123456Z",
                               "endTime": "2021-04-30T23:59:59.045123456Z"
                           }
                       },
                       "value": "42"
                   }
               },
               {
                   "metric": "LOCAL_POST_VIEWS_SEARCH",
                   "totalValue": {
                       "metricOption": "AGGREGATED_TOTAL",
                       "timeDimension": {
                           "timeRange": {
                               "startTime": "2021-01-01T01:01:23.045123456Z",
                               "endTime": "2021-04-30T23:59:59.045123456Z"
                           }
                       },
                       "value": "11"
                   }
               }
           ]
       }
   ]
}

Yanıt, metrikleri içerir. En önemlisi:

  • Konumun Google Haritalar'da 1571 kez görüntülendi
  • 631 konum görüntülemesi aldı.
  • Konum için 3 Yol Tarifi isteği.
  • 42 LOCAL_POST_ACTIONS_CALL_TO_ACTION teklif tıklamasıdır.
  • Google Arama'da Yerel Yayınlar 11 kez görüntülendi

Diğer bir metrik seçeneği de şu işlemleri gerçekleştirmek için Google ile Rezervasyon'u kullanmaktır: işlem bağlantıları oluşturun. Kullanıcılar Google ile Rezervasyon'da oluşturulan işlem bağlantılarını tıkladığında bu işlemleri Google Analytics'e aktarabilir, böylece Google Analytics'te dönüşümleri izleyebilirsiniz. Bkz. dönüşüm izleme belgeleri konulu videomuzu izleyin.

Kullandığınız metrik stratejisi ne olursa olsun, ölçüm, işletmenizin performansını görmekten neler olduğunu anlamanızı sağlar. Sayılar, bu bulucuların etkisini anlamanıza da yardımcı olur. yardımcı olabilir. Ayrıca, Google Analytics'ten gelen metrikleri İşletme Profili metrikleriyle bulucunuzda analizler elde edin. Örneğin, aynı projenin kaç müşterinin bulucudan yol tarifi aldığını görebilir ve kaç müşterinin fiziksel konumlarınızı ziyaret etmek için Google Haritalar'ı tıklayın.

Locator Plus'ı Geliştirme

İşletmenizin türüne bağlı olarak veya kullanıcıların kullanıcı deneyimini daha da geliştirebilirsiniz.

Mobil cihaza yol tarifi gönderiliyor

Kullanıcıların bir konuma ulaşmasını daha da kolaylaştırmak için kısa mesaj veya e-posta gönderebilirsiniz bir yol tarifi bağlantısı ekleyin. Bu düğmeyi tıkladığında Google Haritalar uygulaması, maps.google.com yüklenir veya kullanıcının cihazının web tarayıcısına maps.google.com yüklenir. Bu deneyimlerin her ikisi de kullanıcıya adım adım navigasyon seçeneği sunar. sesli yardım da dahil olmak üzere hedefe ulaşmanıza yardımcı olur.

kullan aşağıdaki gibi bir yol tarifi URL'si oluşturmak için destination parametresi olarak URL kodlamalı yer adı ve destination_place_id parametresi. Oluşturmanın veya kullanmanın maliyeti yoktur Haritalar URL'lerini kullandığından URL'ye bir API anahtarı eklemenize gerek yoktur. 

      https://www.google.com/maps/dir/?api=1&destination=Google%20London&destination_place_id=ChIJVSZzVR8FdkgRTyQkxxLQmVU

Dilerseniz aynı adresi kullanarak bir origin sorgu parametresi sağlayabilirsiniz. biçimini de belirleyebilirsiniz. Ancak bunu atlamakla, talimatlar kullanıcının o anda bulunduğu yerden ve bu bilgiler Locator Plus uygulamanızı kullandıkları yerden farklı olabilir. Haritalar URL'leri travelmode ve benzeri ek sorgu parametresi seçenekleri sağlar Navigasyon açıkken yol tariflerini başlatmak için dir_action=navigate.

Yukarıdaki örnek URL'yi genişleten bu tıklanabilir bağlantı, origin Bu stadyumda, Londra futbol stadyumu olarak kullanılır ve halka açık ulaşım için travelmode=transit toplu taşıma yol tarifini verir.

Bu URL'yi içeren bir kısa mesaj veya e-posta göndermek için üçüncü taraf bir sağlayıcı kullanmanızı öneririz Örneğin, twilio ile giriş yapın. App Engine kullanıyorsanız SMS mesajları göndermek için üçüncü taraf şirketlerden yararlanabilirsiniz veya e-posta. Daha fazla bilgi için bkz. Üçüncü Taraf Hizmetler ile Mesaj Gönderme

Kullanıcıların konumları görselleştirmesine yardımcı olmak için Street View gösteriliyor

Dünyada birçok konum için, Street View bir evin dışını görüntülemek için kullanılabilir. kullanıcılara gelmeden önce konuma ait bir görsel sunan yer alır. Şunları sağlayabilirsiniz: Sokak Görünümü'nü Etkileşimli (web) veya static (API) kullanıcılarınızın web sitenizde "göz atmasını" şuradaki alan: 360 derece. Sokak Görünümü, Android ve iOS

Coğrafi Konum ile kullanıcı konumunu belirleme

Çoğu durumda, Google Haritalar'da yerleşik olarak bulunan konum hizmetlerini kullanarak cihazlar veya tarayıcılar. Bu videoda, bir tarayıcının HTML5 Coğrafi Konum özelliğini kullanarak Google haritasında bir kullanıcı veya cihaz varsa ve izin istemeyle ilgili dokümanlar varsa ve müşterilerin yer almasını Android ve iOS'te kullanılabilir. Ancak, başka bir web sitesi için konum bulucu; Örneğin, cihaz konum hizmetleri devre dışıysa veya cihaz konumunun sahte olmasıyla ilgili endişeler.

Geolocation API, konum ve doğruluk döndüren bir sunucu tarafı API'sidir yarıçapı, istemcinin baz istasyonları ve kablosuz ağ düğümleri hakkındaki bilgilere göre algılayın. Coğrafi Konum'u, kitlenizin sizinle alakalı olup olmadığını veya cihaz tarafından bildirilen konumu karşılaştırmalı olarak kontrol etmek için kullanabilirsiniz.

Özel konum verilerini Yer Ayrıntılarıyla birleştirme

Önceki Yer Ayrıntıları Sağlama bölümünde kullanıcılara zengin bir deneyim seviyesi sunmak için Yer Ayrıntılarını çalışma saatleri, fotoğraflar ve yorumlar gibi konumlarınızla ilgili bilgiler.

Proje zaman çizelgesini farklı verilerin maliyeti alanlarını da kullanabilirsiniz. Maliyetlerinizi yönetmek için sahip olduğunuz stratejilerden biri, konumlarınız Google'dan alınan yeni bilgilerle (genellikle Temel ve İletişim Verileri) Geçici olarak kapalı kalma, tatil günlerinde çalışma saatleri ve kullanıcı puanları, fotoğraflar ve yorumlar gibi haritalar. Konumlarınızın iletişim bilgilerine sahipseniz istekte bulunmanıza gerek yoktur. Yer Ayrıntıları'ndan bu alanları çizebilir ve isteğinizi yalnızca Temel veya Göstermek istediğiniz bilgilere bağlı olarak Atmosfer Verileri alanlarını genişletin.

Google'ın değil, aynı zamanda Google Haritalar'daki yer verilerini kullanmak yerine Yer Ayrıntıları. İlgili içeriği oluşturmak için kullanılan kod laboratuvarı tam yığın bulucu için GeoJSON'u bir veritabanıyla konum bilgilerinizi saklayıp alabilirsiniz.