170 likes | 346 Views
Google Maps. Peta. Alat bantu yang digunakan untuk navigasi / menentukan arah Kompas. manfaat. Untuk mengetahui lokasi Untuk mengetahui keadaan Untuk mengetahui rute jalan dll. Peta Digital. Google Maps http://maps.google.com Microsoft Maps - http ://www.bing.com/maps/ IOS Maps
E N D
Peta • Alat bantu yang digunakanuntuknavigasi/menentukanarah • Kompas
manfaat • Untukmengetahuilokasi • Untukmengetahuikeadaan • Untukmengetahuirutejalan • dll
Peta Digital • Google Maps http://maps.google.com • Microsoft Maps - http://www.bing.com/maps/ • IOS Maps http://www.apple.com/ios/maps/
Google Maps • Salahsatulayanandarigoogle • Free dan open • Up to date
Syarat • Mempunyaiakundigoogle • Familiar dengan java script • Google API
Penggunaan • Masukhttps://code.google.com/apis/console • Pilih Services • AktifkanGoogle Maps API v3
Contohaplikasi • bencana
<!DOCTYPE html> • <html> • <head> • <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> • <style type="text/css"> • html { height: 100% } • body { height: 100%; margin: 0; padding: 0 } • #map-canvas { height: 100% } • </style> • <script type="text/javascript" • src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAIlIahPDf2Xe3uuorcdV-7mZyOiVJfpPY&sensor=true"> • </script> • <script type="text/javascript"> • function initialize() { • varmapOptions = { • center: new google.maps.LatLng (-7.805284,110.364203),// (-7.792466,110.408134), • zoom: 17 • }; • var map = new google.maps.Map(document.getElementById("map-canvas"), • mapOptions); • } • google.maps.event.addDomListener(window, 'load', initialize); • </script> • </head> • <body> • <div id="map-canvas"/> • </body> • </html>
<html> • <head><title> akakom maps </title></head> • <body> • <br /><br /><br /><br /> • <center><iframe width="640" height="480" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Stmik+Akakom+Yogyakarta,+JL+Raya+Janti+Karang+Jambe+no+143,+Yogyakarta,+Indonesia&aq=0&oq=stmik&sll=37.0625,-95.677068&sspn=45.197878,79.013672&ie=UTF8&hq=Stmik+Akakom+Yogyakarta,+JL+Raya+Janti+Karang+Jambe+no+143,+Yogyakarta,+Indonesia&hnear=&radius=15000&t=m&ll=-7.792466,110.408134&spn=0.081637,0.109863&z=13&iwloc=A&output=embed"></iframe><br /><small><a href="https://maps.google.com/maps?f=q&source=embed&hl=en&geocode=&q=Stmik+Akakom+Yogyakarta,+JL+Raya+Janti+Karang+Jambe+no+143,+Yogyakarta,+Indonesia&aq=0&oq=stmik&sll=37.0625,-95.677068&sspn=45.197878,79.013672&ie=UTF8&hq=Stmik+Akakom+Yogyakarta,+JL+Raya+Janti+Karang+Jambe+no+143,+Yogyakarta,+Indonesia&hnear=&radius=15000&t=m&ll=-7.792466,110.408134&spn=0.081637,0.109863&z=13&iwloc=A" style="color:#0000FF;text-align:left">View Larger Map</a></small></center> • </body> • </html>
Tugas • Membuat website yang menampilkanalamatdanPetanya. • Perkelompok @3 mahasiswa • Lokasiberbedatiapkelompok • Lokasi: Malioboro, MonumenJogjaKembali, Monas, Ancol, Juanda Surabaya, Suramadu, PabrikMadukismo, PantaiDepok, Simpang Lima Semarang, JokTengKulon, IswahyudiMadiun, Cirebon, …