Menggunakan API Peta Google Jarak Radial

Pengarang: Alice Brown
Tarikh Penciptaan: 4 Mungkin 2021
Tarikh Kemas Kini: 18 November 2024
Anonim
Menggambar Lingkaran Radius di Google Map (Drawing Radius Circle In GMap)
Video.: Menggambar Lingkaran Radius di Google Map (Drawing Radius Circle In GMap)

Kandungan

Anda dapat menyesuaikan peta Google untuk memenuhi kebutuhan khusus audiens laman web Anda dengan Google Maps 3.0 API. Salah satu kaedah pemperibadian adalah memasukkan bulatan yang menunjukkan jejari jarak di sekitar tempat tertentu. Anda boleh, misalnya, menunjukkan jarak lima kilometer di sekitar tempat pelancongan supaya pengunjung dapat melihat hotel dan restoran yang berdekatan. Untuk membuat radius jarak di sekitar lokasi atau titik, gunakan kelas "Lingkaran" Peta Google.

Langkah 1

Buka fail HTML dan pergi ke bahagian yang mengandungi kod peta Google.

Langkah 2

Tatal ke bawah kod sehingga anda menemui kod yang menentukan lokasi penanda. Untuk mencari penanda buku dengan mudah, cari istilah "google.maps.Marker" dalam fail HTML.

Langkah 3

Di bawah tempat anda menentukan penanda, buat lapisan "Lingkaran" dan pasangkannya. Contohnya, taip:

var circleExample = google.maps.Circle baru ({peta: peta

Langkah 4

Tambahkan jejari bulatan yang akan berada di sekitar penanda dalam meter:


var circleExample = google.maps.Circle baru ({peta: jejari peta: 5000

Langkah 5

Buat warna isian untuk bulatan. Anda menentukan warna menggunakan format heksadesimal. Contohnya, taip:

var circleExample = google.maps.Circle baru ({peta: jejari peta: 5000 fillColor = #FFFFFF});

Langkah 6

Kaitkan, atau tambahkan, lingkaran ke penanda:

var circleExample = google.maps.Circle baru ({peta: jejari peta: 5000 fillColor = #FFFFFF}); circleExample.bindTo ('peta', penanda);

Langkah 7

Simpan peta dan uji. Peta Google akan menunjukkan bulatan putih dengan radius 5.000 meter di sekitar lokasi penanda.