Simple icon marker google maps |
Setelah ulasan sebelumnya mengenai pembuatan simple map, maka pada kesempatan kali ini saya ingin berbagi mengenai pembuatan marker pada google map api. Berikut codenya :
<!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> <meta charset="utf-8"> <title>Simple markers</title> <style> html, body, #map-canvas { height: 100%; margin: 0px; padding: 0px } </style> <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script> <script> function initialize() { var myLatlng = new google.maps.LatLng(-7.8730414,110.4242874); var mapOptions = { zoom: 4, center: myLatlng } var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); var marker = new google.maps.Marker({ position: myLatlng, map: map, title: 'ini lokasi saya' }); } google.maps.event.addDomListener(window, 'load', initialize); </script> </head> <body> <div id="map-canvas"></div> </body> </html>
Langkah kerjanya :- Copy lalu paste code di atas pada text editor seperti notepad.exe
- Simpan menggunakan tipe file *.html
- Koordinat yang saya blok berwarna biru dapat diganti sesuai koordinat wilayah yang ingin anda tampilkan
- Begitu pula "title" dapat diganti sesuai keinginan, misalnya; 'rumah saya', atau 'sekolah saya'
Demikian sedikit tulisan saya mengenai simple marker. Apabila anda ingin merubah icon marker dapat dilihat pada artikel tentang Kustomisasi Icon Marker. Selamat mencoba...
ConversionConversion EmoticonEmoticon