กำหนดตำแหน่งของเราให้แสดงในแผนที่ Google Map
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>วิทยาลัยเฉลิมกาญจนา</title> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true"></script> </head> <body> <div id="map_canvas" style="background: #f5f5f5; width: 600px; height:550px;"></div> <script type="text/javascript"> var ckc_pcb = new google.maps.LatLng( 16.3416218, 101.0902424 ); /* default location*/ function initialize() { var myOptions = { zoom: 12, //center: latlng, mapTypeControl: false, navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL}, mapTypeId: google.maps.MapTypeId.ROADMAP, /*center: new google.maps.LatLng(13.741620721743634, 100.53290683890078),*/ disableDefaultUI: false, streetViewControl: false, navigationControl: true, mapTypeControl: false }; var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); defaultGeolocation(); function defaultGeolocation() { map.setCenter(ckc_pcb); setMarker(ckc_pcb); } function setMarker(initialLatLng) { var opts = new Object; opts.title = "วิทยาลัยเฉลิมกาญจนาเพชรบูรณ์ เลขที่ 333 หมู่ 8 ตำบลบ้านโตก อำเภอเมือง จังหวัดเพชรบูรณ์ 67000"; opts.position = initialLatLng; opts.map = map; var marker = new google.maps.Marker(opts); } } $(document).ready(function() { initialize(); }); </script> </body> </html>
ตัวอย่าง : ckc_map_pcb