Lapisan adalah objek di peta yang terdiri dari satu atau beberapa item terpisah, tetapi dimanipulasi sebagai unit tunggal. Lapisan umumnya menggambarkan kumpulan objek yang Anda tambahkan ke atas peta untuk menunjukkan hubungan kesamaan. Maps JavaScript API mengelola penyajian objek dalam lapisan dengan merender item konstituennya menjadi satu objek (biasanya overlay petak peta) dan menampilkannya saat area pandang peta berubah. Lapisan juga dapat mengubah lapisan penyajian peta itu sendiri, yang sedikit mengubah petak peta dasarnya secara konsisten dengan lapisan. Perlu diingat bahwa sebagian besar lapisan, sesuai desainnya, tidak dapat diakses melalui masing-masing objeknya, melainkan hanya dapat direkayasa sebagai satu kesatuan.
Ringkasan Lapisan
Maps JavaScript API memiliki beberapa jenis lapisan:
- Lapisan Google Maps Data menyediakan penampung untuk data geospasial arbitrer. Anda dapat menggunakan lapisan Data untuk menyimpan data kustom, atau untuk menampilkan data GeoJSON pada peta Google.
- Lapisan peta panas merender data geografis menggunakan visualisasi Peta panas.
- Lapisan KML merender elemen KML dan GeoRSS menjadi overlay petak peta Maps JavaScript API.
- Lapisan lalu lintas menampilkan kondisi lalu lintas pada peta.
- Lapisan transportasi umum menampilkan jaringan transportasi umum kota Anda pada peta.
- Objek Lapisan bersepeda merender lapisan jalur sepeda dan/atau overlay khusus sepeda ke dalam lapisan umum. Lapisan ini ditampilkan secara default dalam DirectionsRenderer saat meminta rute mode perjalanan BERSEPEDA.
Menambahkan lapisan
Untuk menambahkan lapisan ke peta, Anda hanya perlu memanggil metode setMap()
, dengan meneruskan objek peta yang akan menampilkan lapisan ke metode tersebut. Demikian pula, untuk menyembunyikan lapisan, panggil metode setMap()
, dengan meneruskan null
ke metode tersebut.
Cuplikan di bawah ini memusatkan peta di London, Inggris Raya, dan menambahkan lapisan Transportasi Umum.
var mapOptions = { zoom: 13, center: new google.maps.LatLng(51.5,-0.11) } var map = new google.maps.Map(document.getElementById("map"), mapOptions); var transitLayer = new google.maps.TransitLayer(); transitLayer.setMap(map);