หลังจากที่ได้ลองนำ Google Map มาใส่ในเว็บไซต์ของเราแล้ว ครั้งนี้เราจะลองนำ Marker มาปักบน Google Map ของเรามั่งครับ ซึ่งตัวอย่างที่ผมจะนำมาแสดงให้ดู จะค่อนข้างครอบคุมและสามารถนำไปประยุกต์ใช้ต่อได้ วิธีการใช้ก็ไม่ยากแค่เพิ่มโค๊ดมาสามสี่บรรทัด เป็นโค๊ดสำหรับสร้าง Marker แล้วเราก็ใช้เมธอด setMap() เรียกมาแสดงได้เลย
Basic Maker
<script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyAu08o0WD6buv6P6bu--XFyo2KrIScQgrg&sensor=false"></script>
<script>
function loadmap()
{
var mapSet = {
center:new google.maps.LatLng(13.727896,100.524124),
zoom:7,
mapTypeId:google.maps.MapTypeId.ROADMAP
};
var map=new google.maps.Map(document.getElementById("googleMap"),mapSet);
//Create marker object
var marker=new google.maps.Marker({
position:new google.maps.LatLng(13.727896,100.524124),
});
//Set marker to google map
marker.setMap(map);
}
google.maps.event.addDomListener(window, 'load', loadmap);
</script>
<div id="googleMap" style="width:500px;height:400px;"></div>
