Lin Lin Dev

      วันนี้ได้ลองเล่น MAP API แผนที่ออนไลน์แบบไทยๆบ้างครับ นั่นคือ MM MAP API ครับ   หลังจากที่หมกมุ่นอยู่กับ Google Maps API   อยู่นาน ไม่รู้ว่าคนไทยเราก็ทำได้ไม่แพ้ใครเลยครับ ขอบอกว่าสุดยอดมากเลยครับ ถึงมีเครื่องไม้เครื่องมือไม่หลากหลายเหมือน Google แต่ก็เพียงพอสำหรับที่จะดึงข้อมูลที่สำคัญออกมาใช้กับโปรเจ็คของเราครับ เช่น ละติจูด , ลองติจูด , ค่าซุม , รายละเอียดที่อยู่ต่างๆ (ซอย,ถนน) ซึ่งผมได้ลองเปรียบเทียบกับแผนที่ในพี่กู๋ดูแล้ว ดูเหมือนว่าจะละเอียดกว่า Google Maps ซะอีกแฮะ ไม่ว่าจะเป็นข้อมูลสถานที่ต่างๆ ที่บอกได้ละเอียดมากเลยครับ ลองอ่านบทความเปรียบเทียบระหว่าง longdo กับ Google ได้ที่เลยครับ ->http://pepzewee.exteen.com/20100412/longdo-map       MM MAP API เป็นบริการของ Longdo Map   เราสามารถนำข้อมูลแผนที่ของ Longdo Map มาแสดงในหน้าเว็บของเราตามที่ต้องการ เช่น กำหนดตำแหน่งที่ตั้งของสถานที่ โดยที่เราสามารเรียกใช้Methodต่างๆที่ Longdo ได้จัดเตรียมไว้แล้วมาใช้งาน มาดูโค๊ดที่ผมได้ลองทำกันเลยครับ แ...

        บทความนี้เราจะมาเล่นกับเวลากันซักหน่อยครับ จะเป็น การเขียนโค๊ดนับเวลาถอยหลัง ซึ่งเป็นโค๊ดที่ผมพัฒนาขึ้นมาเล่นๆ  โดยมีแนวคิดที่นำไปใช้ประโยชน์ใน เว็บประมูลสินค้า ครับ และผมได้ทดสอบดูแล้ว ซึ่งมีผลลัพธ์ตรงกับ เว็บประมูลสินค้า อื่นๆเลยครับ เช่น ระบบประมูลของตลาดดอทคอม ในโค๊ดคุณจะได้เห็นวิธีแทรกโค๊ด ภาษาพีเอชพี ลงใน จาวาสคริปต์ ได้ด้วยครับ ให้สังเกตุคำสั่ง setTimeout("countDown(<?=$mktime?>);",1000); หากเป็น เว็บประมูล เราสามารถ ดึงข้อมูลวัน/เวลาจากฐานข้อมูล โดยใช้พีเอชพี (จาวาสคริปต์ไม่สามารถทำได้) แล้ว เอาค่าวันเวลาในฐานข้อมูลมาเก็บไว้ในตัวแปรของพีเอชพี แล้ว แทรกตัวแปรของพีเอชพีลงในจาวาสคริปต์ อีกทีนึง ครับ

ช่วงนี้มีเวลาว่างเยอะหน่อยครับ ก็เลยศึกษา Service ของ Google Maps API ตัวนึง ชื่อว่า Street View เล่นๆครับ Street View เป็นภาพมุมมองจากถนนทีถ่ายจากสถานที่จริง ซึงเป็นบริการที่ทำงานภายใน Google Maps สามารถเลือกมุมมองได้ถึง 360 องศา ประโยชน์ของมันก็คือ สามารถชมสถานที่ต่างๆ ที่ได้บรรยากาศจริง และสามารถจดจำสถานที่ได้ดีกว่าดูในแผนที่แบบปกติ เราสามารถดึงข้อมูลต่างๆของ Google Street View เอามาใช้กับ ร้านค้าออนไลน์ เพื่อใช้ระบุตำแหน่งและหน้าตาของร้านค้าของเรานั่นเองครับ มาดูโค๊ดตัวอย่างง่ายๆกันเลยครับ ขี้เกียจอธิบายมากครับ เพราะผมอธิบายไม่ค่อยเก่ง ^^’’

      ผมเคยได้สอนใช้งาน jQuery UI มาบ้างแล้วเหมือนกันครับ ดูได้จาก jQuery UI ส่วนมากบทความที่สอน จะเป็นการนำ jQuery UI มาประยุกต์ใช้กั บเว็บร้านค้าออนไลน์ หรือ Web E-commerce ครับ และบทความนี้ก็เหมือนกัน ผมจะใช้ Dialog ของ jQuery UI มาใช้ในการแสดงผลรูปภาพ ซึ่งเป็นการแสดงผลแบบซูมรูปภาพครับ โดยที่เราไม่จำเป็นต้องใช้ PlugIn ซูมรูปภาพตัวอื่นๆเลยครับ เช่น LightBox,Fancybox และข้อดีของมันคือ เราสามารถกำหนดEffectการแสดงผลรูปภาพได้หลากหลาย มาดูCodeตัวอย่างง่ายๆกันเลยครับ

       หลังจากที่ได้ศึกษา Google Maps API อยู่พักนึง ทำให้รู้ว่าจะดึงข้อมูลของแผนที่ออกมาใช้ประโยชน์อะไรบ้างครับ ก็เลยลองเอามาประยุกต์ใช้กับฐานข้อมูลบ้างครับ เผื่อหลายท่านที่ได้อ่านบทความนี้จะนึกภาพการนำมาใช้งานออกครับ ถ้าเป็น เว็บร้านค้าออนไลน์ แล้ว สิ่งที่เราจะบอกกับลูกค้าคือ ที่ตั้งของร้านค้าของเรานั่นเอง ไม่อยากอธิบายมากครับ มาดูโค๊ดกันเลย ผมจะใช้เทคนิค AJAX ของ jQuery มาประยุกต์ใช้ในการส่งค่าบันทึกลง ฐานข้อมูลMySQL นะครับ ผมได้สร้างเทเบิลในฐานข้อมูล เพื่อเก็บข้อมูลแผนที่ ดังนี้ CREATE TABLE `tb_mapsgoo` ( `id_mps` int(3) NOT NULL auto_increment, `name_mps` varchar(100) default NULL, `lat_mps` varchar(20) default NULL, `lng_mps` varchar(20) default NULL, `zoom_mps` varchar(2) default NULL, PRIMARY KEY (`id_mps`) ); id_msp-> ไอดีของแผนที่ ผมกำหนดให้เป็น PK name_mps->ชื่อสถานที่ lat_mps->ละติจูด lng_mps->ลองติจูด zoom_mps->Zoom Level ในแผนที่ของ Google