ให้เรตสมาชิก: 3 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน
 

บทที่ 14 HTML5 Geolocation ตอนที่ 1
   geolocation คือการระบุพิกัด latitude, longitude ที่เราอยู่ด้วยคำสั่งJavaScript ที่มาใหม่กับ HTML5
การระบุพิกัดนี้ ความแม่นยำขึ้นอยู่กับอุปกรณ์ที่ใช้เปิดเว็บไซต์ เช่น โทรศัพท์มือถืออย่าง Android, iphone จะมี gps ให้ใช้ และ gps นี้จะช่วยให้ระบุพิกัดได้อย่างแม่นยำมากๆ
   Geolocation นั้นสนับสนุนแทบทุกบราวเซอร์ ไม่ว่าจะเป็น Internet Explorer 9, Firefox, Chrome, Safari และ Opera
1. ตัวอย่าง การแสดงพิกัดแบบ latitude และ longitude

<html>
<body>
<p id="demo">หาตำแหน่งของฉัน</p>
<button onclick="getLocation()">คลิก</button>
<script>

var x=document.getElementById("demo");

function getLocation()
  {  if (navigator.geolocation)    {    navigator.geolocation.getCurrentPosition(showPosition);   }
  else{x.innerHTML="Geolocation is not supported by this browser.";}  }function showPosition(position)
  {  x.innerHTML="Latitude: " + position.coords.latitude +   "<br>Longitude: " + position.coords.longitude;      }

</script>
</body>
</html>

ผลลัพธ์คือ

***โค๊ด HTML5 ในการหาพิกัดตามตัวอย่างข้างบนนี้ สามารถใช้หาพิกัด latitude และ longitude โดยเมื่อเรียกแล้ว ในครั้งแรกเบราเซอร์จะถามถึงการอนุญาต share location ก็ให้เรากดแชร์ไป และก็รอสักพัก ข้อมูลต่างๆจะโผล่ขึ้นมาใต้คำว่าตำแหน่งของฉัน:

2.ตัวอย่าง ในกรณีที่เราต้องการแสดงค่าError หากไม่สามารถหาพิกัดได้ <โดยเติมโค๊ด function showError(error)>

<html>
<body>
<p id="demo">Click the button to get your coordinates:</p>
<button onclick="getLocation()">Try It</button>
<script>

var x=document.getElementById("demo");

function getLocation()
  {  if (navigator.geolocation)    {    navigator.geolocation.getCurrentPosition(showPosition,showError);    }
  else{x.innerHTML="Geolocation is not supported by this browser.";}  }
function showPosition(position)  {  x.innerHTML="Latitude: " + position.coords.latitude + 
  "<br>Longitude: " + position.coords.longitude;     }

function showError(error)
  {  switch(error.code)     {    case error.PERMISSION_DENIED:
      x.innerHTML="User denied the request for Geolocation."
      break;     case error.POSITION_UNAVAILABLE:
      x.innerHTML="Location information is unavailable."
      break;     case error.TIMEOUT:
      x.innerHTML="The request to get user location timed out."
      break;     case error.UNKNOWN_ERROR:
      x.innerHTML="An unknown error occurred."       break;    }  }

</script>
</body>
</html>

   จากตัวอย่างข้างบนเป็นโค๊ดสำหรับแสดงค่า error ซึ่งจะแสดงให้เห็นค่า error ก็ต่อเมื่อไม่สามารถหาพิกัดได้เท่านั้น

อ่านเพิ่มเติม
บทที่ 14 HTML5 Geolocation คือเทคโนโลยีที่ช่วยหาพิกัด ตอนที่ 2

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
การอ่านค่าจาก URL หรือค่า GET ใน Joomla
โดย Parichat พฤ 22 ก.พ. 2018 11:12 pm บอร์ด Joomla Developing Knowledge
0
2
พฤ 22 ก.พ. 2018 11:12 pm โดย Parichat
การใช้งาน Python GUI (Tkinter) : การ Image (การเปิดภาพ)
โดย Jom07 พฤ 22 ก.พ. 2018 6:17 pm บอร์ด Python Knowledge
0
3
พฤ 22 ก.พ. 2018 6:17 pm โดย Jom07
การใช้งาน Python GUI (Tkinter) : การ Browse file (การค้นหาไฟล์)
โดย Jom07 พฤ 22 ก.พ. 2018 5:16 pm บอร์ด Python Knowledge
0
11
พฤ 22 ก.พ. 2018 5:16 pm โดย Jom07
Liverpool เจ้ายุโรป 5 สมัย
โดย Before Dong พฤ 22 ก.พ. 2018 11:14 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
29
พฤ 22 ก.พ. 2018 11:14 am โดย Before Dong
การใช้งาน Python GUI (Tkinter) :Label widget (วิดเจ็ตป้ายกำกับ)
โดย Jom07 พ 21 ก.พ. 2018 5:36 pm บอร์ด Python Knowledge
0
16
พ 21 ก.พ. 2018 5:36 pm โดย Jom07
รูปแบบการดึงข้อมูลจากฐานข้อมูลใน Joomla
โดย Parichat พ 21 ก.พ. 2018 5:25 pm บอร์ด Joomla Developing Knowledge
0
12
พ 21 ก.พ. 2018 5:25 pm โดย Parichat
การใช้ปุ่ม Button ชนิดต่างๆ ใน Python GUI (Tkinter)
โดย Jom07 พ 21 ก.พ. 2018 5:07 pm บอร์ด Python Knowledge
0
18
พ 21 ก.พ. 2018 5:07 pm โดย Jom07
Slideshow CK (สไลด์โชว์ ซีเค)-Module ที่สามารถแสดงรูปภาพและวีดีโอที่มีลิ้งที่มีลักษณะพิเศษได้
โดย Parichat พ 21 ก.พ. 2018 4:11 pm บอร์ด Joomla Extension Review
0
16
พ 21 ก.พ. 2018 4:11 pm โดย Parichat
มีใครใช้ Zoho Creator ทำแอพมั้ยคะ ช่วยด้วยค่ะ
โดย 156595465 พ 21 ก.พ. 2018 3:14 pm บอร์ด Mobile Programming - Android, iOS, Window Phone
0
21
พ 21 ก.พ. 2018 3:14 pm โดย 156595465
วิวัฒนาการของการเก็บข้อมูล
โดย Before Dong พ 21 ก.พ. 2018 10:42 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
29
พ 21 ก.พ. 2018 10:42 am โดย Before Dong
มีใครใช้ Zoho Creator เขียนแอพตัวเองมั้ยคะ
โดย 156595465 พ 21 ก.พ. 2018 6:25 am บอร์ด Mobile Programming - Android, iOS, Window Phone
0
21
พ 21 ก.พ. 2018 6:25 am โดย 156595465
Q :ต้องการบันทึกข้อมูลการคำนวนระยะทางตอนที่ผู้ใช้งานค้นหาจากจังหวัดต้นทางและจังหวัดปลายทาง ใน Joomla
โดย Parichat อ 20 ก.พ. 2018 6:43 pm บอร์ด Joomla Development
2
31
พฤ 22 ก.พ. 2018 11:00 pm โดย Parichat
Modals (โม'เดิล)-Plugin ที่ทำให้เชื่อมโยงที่เปิดในป็อปอัพโมเดิล
โดย Parichat อ 20 ก.พ. 2018 6:20 pm บอร์ด Joomla Extension Review
0
25
อ 20 ก.พ. 2018 6:20 pm โดย Parichat
การใช้งาน Python GUI (Tkinter) :Create List box (สร้างกล่องรายการ)
โดย Jom07 อ 20 ก.พ. 2018 3:07 pm บอร์ด Python Knowledge
0
37
อ 20 ก.พ. 2018 3:07 pm โดย Jom07
คู่มือ VDO
โดย tsukasaz อ 20 ก.พ. 2018 2:58 pm บอร์ด RTP - Right To Play Thailand Foundation (7 ก.พ. - 15 มิ.ย.61)
0
3
อ 20 ก.พ. 2018 2:58 pm โดย tsukasaz
ประชุมทีม
โดย tsukasaz อ 20 ก.พ. 2018 2:57 pm บอร์ด RTP - Right To Play Thailand Foundation (7 ก.พ. - 15 มิ.ย.61)
0
1
อ 20 ก.พ. 2018 2:57 pm โดย tsukasaz
ไฟล์ตัวติดตั้ง
โดย tsukasaz อ 20 ก.พ. 2018 2:57 pm บอร์ด RTP - Right To Play Thailand Foundation (7 ก.พ. - 15 มิ.ย.61)
0
1
อ 20 ก.พ. 2018 2:57 pm โดย tsukasaz
รายงานความคืบหน้า / Progress
โดย tsukasaz อ 20 ก.พ. 2018 2:56 pm บอร์ด RTP - Right To Play Thailand Foundation (7 ก.พ. - 15 มิ.ย.61)
0
1
อ 20 ก.พ. 2018 2:56 pm โดย tsukasaz
G - ข้อมูลสำหรับทำระบบ RTP - ระบบติดตามและประเมินผลและบริหารข้อมูลโครงการ
โดย mindphp อ 20 ก.พ. 2018 2:05 pm บอร์ด RTP - Right To Play Thailand Foundation (7 ก.พ. - 15 มิ.ย.61)
1
9
อ 20 ก.พ. 2018 4:04 pm โดย mindphp
การทำงานของ Front-End กับ Back-End
โดย Before Dong อ 20 ก.พ. 2018 9:57 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
1307
อ 20 ก.พ. 2018 9:57 am โดย Before Dong