Google Maps API คืออะไร
Google Maps API ทำให้ท่าน สามารถแทรก Google Maps หรือแผนที่จาก Google ลงในเว็บเพจของท่าน
เพื่อประโยชน์ เช่น ระบุตำแหน่งที่ตั้งของ บริษัท ,สถานที่, ที่นัดหมาย เป็นต้น ได้ โดยสามารถจะจัดการรายละเอียด
ต่างๆในแผนที่ เช่นเดียวกับที่ใช้งานใน //maps.google.com ได้
การใช้งาน Google Maps API จำเป็นจะต้องมี Google Maps API Key
ซึ่งสามารถเข้าไปขอรับได้ที่ url ตามด้านล่างนี้
http://code.google.com/apis/maps/signup.html
เมื่อเข้าไปแล้วให้กดเลือก ยอมรับเงื่อนไข การใช้งาน และกรอก url เว็บไซต์ที่ต้องการนำ google map ไปใช้
ในกรณีต้องการทดสอบที่เครื่องการใช้จริง สามารถ ใช้ script ด้านล่างแทนได้ เมื่อใช้งานจริง จึงค่อยเปลี่ยน
ในส่วนค่า key=ABQIAAAAcNvUk-nhOGHxtqYjlYDTRRRn0sJCm-CFhvGa72HC9maIDPrX5RTjV4z1TYBiTrysASJhAHZCMDeQ_A
เป็นค่าใหม่
<script src="//maps.google.com/maps?file=api&v=2&key=ABQIAAAAcNvUk-nhOGHxtqYjlYDTRRRn0sJCm-CFhvGa72HC9maIDPrX5RTjV4z1TYBiTrysASJhAHZCMDeQ_A" type="text/javascript"></script>
ตัวอย่างโค้ด google map พื้นฐาน แสดงแผนที่ประเทศไทย
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
html{
padding:0px;
margin:0px;
}
div#map_canvas{
margin:auto;
width:500px;
height:450px;
overflow:hidden;
}
</style>
</head>
<body onload="initialize()" onunload="GUnload()">
<div id="map_canvas">
</div>
<script src="//maps.google.com/maps?file=api&v=2&key=ABQIAAAAcNvUk-nhOGHxtqYjlYDTRRRn0sJCm-CFhvGa72HC9maIDPrX5RTjV4z1TYBiTrysASJhAHZCMDeQ_A" type="text/javascript"></script>
<script type="text/javascript">
function initialize() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(13.77436,100.53458), 5);
map.setUIToDefault();
}
}
</script>
</body>
</html>
