Cara Menggunakan Nomor, Bukan Surat di Google Custom Marker

Penanda Google Maps menyoroti situs tertentu pada peta. Secara default, Google mengidentifikasi satu penanda dengan satu bujur sangkar dan beberapa penanda dengan huruf, tetapi ini mungkin tidak sesuai dengan beberapa aplikasi. Misalnya, jika perusahaan Anda menyebut cabang sebagai situs 1, 2 dan 3, spidol bernomor akan mengidentifikasi mereka lebih jelas daripada huruf. Gunakan spidol khusus di program Anda untuk merancang label Anda sendiri untuk lokasi peta. Marker ini menggunakan ikon khusus, yang dapat Anda kode menggunakan API Google Charts.

1.

Buka kode sumber program Anda dengan program pengembangan Java seperti Eclipse.

2.

Gulir ke fungsi "inisialisasi". Blok kode ini mendefinisikan peta Anda dan menentukan opsi untuknya. Misalnya, kode dapat dibaca:

fungsi inisialisasi () {

var coordinate = new google.maps.LatLng (42.346429, -71.097186);

var myOptions = {

zoom: 4,

pusat: koordinat,

mapTypeId: google.maps.MapTypeId.ROADMAP

}

var ourHeadquarters = new google.maps.Map (document.getElementById ("map_canvas"), myOptions);

}

3.

Tambahkan garis baru yang mendefinisikan garis lintang dan bujur dari penanda Anda. Misalnya, jika marker Anda harus menunjukkan garis lintang 42.349093 dan garis bujur -71.101971, tambahkan baris berikut:

var markerCoordinates = new google.maps.LatLng (42.349093, -71.101971);

4.

Tambahkan blok berikut untuk membuat marker Anda:

penanda var = google.maps.Marker baru ({

posisi: markerCoordinates,

peta: kantor pusat kami,

});

Ganti "markerCoordinate" dengan variabel yang Anda buat pada langkah sebelumnya, dan ganti "markas kami" dengan variabel yang terkait dengan peta Anda.

5.

Tambahkan baris berikut dalam blok marker untuk membuat ikon marker:

ikon: '// chart.apis.google.com/chartchst=d_map_pin_letter&chld=A|FF0000|000000'

6.

Ganti "A" di baris dengan angka. Misalnya, ganti dengan "1, " mengubah baris ke:

ikon: '// chart.apis.google.com/chartchst=d_map_pin_letter&chld=1|FF0000|999999'

7.

Ubah "FF0000" menjadi kode heksidecimal HTML latar belakang marker. Misalnya, untuk mengatur warna latar belakang menjadi kuning, yang menggunakan kode "FFFF00, " ganti kode dengan "FFFF00, " mengubah baris menjadi:

ikon: '// chart.apis.google.com/chartchst=d_map_pin_letter&chld=1|FFFF00|999999'

8.

Ubah "999999" menjadi kode heksadesimal HTML dari teks nomor penanda. Misalnya, untuk menulis teks ini dalam warna hitam, yang menggunakan kode "000000, " ganti kode dengan "000000, " mengubah baris menjadi:

ikon: '// chart.apis.google.com/chartchst=d_map_pin_letter&chld=1|FFFF00|000000'