กำหนดตำแหน่งของเราให้แสดงในแผนที่ Google Map
[code lang=”javascript”]
<!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>
[/code]
ตัวอย่าง : ckc_map_pcb