ทักทายครับ

สวัสดีครับ หลังจากที่ blog นี้หยุดการอัพเดททบความเกี่ยวกับโค้ดในการใช้ทำเวปไปนานไม่ว่าจะเป็น code php, html, javascript, css, ajax เนื่องจากผมไม่ค่อยมีเวลาจนลืม blog นี้ไปเลย นึกขึ้นได้ตอนปีใหม่ ไปค้นหาใน google แล้วตกใจ เนื่องจาก blog นี้ไปอยู่ลำดับที่ 1 ของการค้นหา ไม่เชื่อลองดู เลยขอถือโอกาสเริ่มต้นใหม่ในช่วงปีใหม่นี้เริ่มอัพเดทบทความตั้งแต่ตอนนี้เป็นต้นไป หวังเป็นอย่างยิ่งว่าจะมีผู้ติดตามบทความของผมต่อไปน่ะครับ ปล.ท่านใดสนใจลงโฆษณาสามารถติดต่อได้ที่ hotcodephp@gmail.com

16 พ.ค. 2555

Google Maps API V.2 อย่างง่าย ตอนที่ 2 หาพิกัดบนแผนที่ แบบที่ 3

เมื่อวานผมเขียนการหาพิกัดบนแผนที่ของ google maps api แบบที่ 2 แล้วคือพอคลิกที่แผนที่จะมีหน้าต่างขึ้นมาบอกพิกัด และก็ก่อนหน้านี้แบบที่ 1 เมื่อคลิกที่แผนที่ก็จะแสดงพิกัดอยู่ข้างใต้แผนที่ วันนี้ผมขอนำเสนออีกวิธี ซึ่งเป็นวิธีสุดท้ายของผมน่ะครับ คือ

แบบที่ 3 ทำการส่งค่าตำแหน่งที่ทำการคลิก เพื่อส่งข้อมูลไปที่หน้าต่อไป โดยในตัวอย่างนี้จะส่งค่า lat และ lng

ตัวอย่างที่3

<br />
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><br />
<html xmlns="http://www.w3.org/1999/xhtml"><br />
<head><br />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><br />
<title>ตัวอย่างที่3</title><br />
<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAKaJQ6galA0QmFhNdQzYuwRQnaT__a1y-hZdnJBN4Ggj_4W3wVRTkKlGxp0EJvRTbiAqcn-FCYSTDog" 
       type="text/javascript"></script><br />
<script src="js/gmaps.CircleOverlay.js" type="text/javascript"></script><br />
<script type="text/javascript">
    //<![CDATA[
    var map;
    var geocoder;

function load() {
      if (GBrowserIsCompatible()) {
 map = new GMap2(document.getElementById("map_canvas"));
 geocoder = new GClientGeocoder();
 map.addMapType(G_PHYSICAL_MAP);
 map.addControl(new GLargeMapControl());
 map.addControl(new GMapTypeControl());
 map.setCenter(new GLatLng(13.8196,100.0601), 11);
      }
 }

function initialize() {
    GEvent.addListener(map,"click", function(overlay,latlng) {     
          if (latlng) {   
     var matchll = /\(([-.\d]*), ([-.\d]*)/.exec( latlng );
   if ( matchll ) { 
     var lat = parseFloat( matchll[1] );
     var lng = parseFloat( matchll[2] );
     lat = lat.toFixed(6);
     lng = lng.toFixed(6);
    }
            var myHtml = "กระทำการใส่ข้อมูลตำแหน่งนี้:
<input type='button' onClick='javascript:Addpoint("+lat+","+lng+");' value='ทำการบันทึก'>";

map.openInfoWindow(latlng, myHtml);
          }
      });
 }

function Addpoint(lat,lon){
  window.location="ex_3p.php?lat="+lat+"&lng="+lon;
  }
    //]]>

</script><br />
<style type="text/css">

</style></head><br />
<body onload="load(),initialize()" onunload="GUnload()"><br />
<div id="map_canvas" style="width: 600px; height: 400px"></div></body><br />
</html><br />
<br />

เมื่อเราคลิกที่แผนที่ก็จะแสดงหน้าต่างที่จะส่งค่าไปหน้าต่อไป ในหน้าที่รับค่าจะต้องทำการกระกาศค่าตัวแปรก่อนเพื่อให้เรียกใช้งานได้เช่นจากตัวอย่างนี้ส่งค่า lat และ lng ก็ให้ประกาศก่อนด้วยว่า

$lat = $_GET["lat"];
$lng = $_GET["lng"];
?>

ไม่มีความคิดเห็น:

แสดงความคิดเห็น