Dapatkan batas Google Map, diberi kotak pembatas, tanpa memuat peta?

Saya sedang membangun pencari toko dan ingin menerapkan alur kerja berikut:

  1. Pengguna memasuki suatu lokasi
  2. Kami melakukan geocode menggunakan Google Geocoder
  3. Kami memeriksa hasil geocode untuk kotak pembatas
  4. Kami memperbesar peta agar sesuai dengan batas yang ditentukan dan menanyakan penyimpanan dalam batas tersebut
  5. Jika ada toko dalam batas peta, tampilkan semuanya di peta
  6. Namun jika sekarang tidak ada toko di dalam kotak pembatas peta, perbesar satu tingkat lebih jauh, dan ulangi (5) sampai kita menemukan beberapa toko.

Hal di atas baik-baik saja, tetapi UX akan lebih baik jika peta tidak benar-benar tampak bergerak sampai beberapa toko ditemukan.

Jadi, apakah mungkin untuk menanyakan Google Maps sebagai berikut: Dengan adanya kotak pembatas, dapatkah kita menemukan batas Google Map yang diperbesar dengan benar yang berisi kotak pembatas tersebut, tanpa benar-benar memuat Google Peta?

Saya tidak yakin itu mungkin, karena saya rasa tergantung pada lebar div peta di halaman saya.

geocoder.geocode( {'address': search_text }, function(results, status) {
  if (status == google.maps.GeocoderStatus.OK) {
    map.panTo(results[0].geometry.location);
    map.fitBounds(results[0].geometry.bounds);
    var bounds_to_check_for_stores = map.getBounds();
    // QUESTION: get bounds_to_check_for_stores without the three preceding steps?
    } 
 }

person flossfan    schedule 15.05.2012    source sumber


Jawaban (1)


google.maps.LatLngBoundsapi-doc memiliki metode : extend(point:LatLng) yang memungkinkan Anda memperluas batas untuk memastikan bahwa batas disesuaikan untuk menyertakan titik LatLng yang diteruskan sebagai parameter. Metode extend mengembalikan LatLngBounds yang telah disesuaikan.

Dengan ini, Anda dapat:

  1. Perluas radius pencarian geocode hingga Anda menemukan penyimpanan yang sesuai.
  2. Temukan toko atau grup toko terdekat yang ingin Anda gunakan.
  3. Ambil batas saat ini dari peta: Map.getBounds().
  4. Panggil LatLngBounds.extend untuk menyesuaikan batas, menggunakan properti .geometry.location dari toko yang Anda pilih pada Langkah 2.
  5. Panggil Map.panToBounds untuk mengubah area pandang peta, menjaga pengalaman pengguna tetap sederhana, karena hanya satu perubahan pada tampilan yang akan dilakukan.
person Sean Mickey    schedule 15.05.2012