ให้เรตสมาชิก: 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

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
สอบถามเกี่ยวกับการตั้งค่า Jabber phpBB3.2.x
โดย AePongsak จ 22 ม.ค. 2018 5:54 pm บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS CRM
0
8
จ 22 ม.ค. 2018 5:54 pm โดย AePongsak
เสือชีตาห์ Vs โปรแกรมเมอร์
โดย Before Dong จ 22 ม.ค. 2018 11:14 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
1
19
จ 22 ม.ค. 2018 11:31 am โดย Before Dong
งานประจำวันที่ 22 มกราคม 2561
โดย Parichat จ 22 ม.ค. 2018 9:57 am บอร์ด MT21 - ปาริชาติ รัตโณภาส
1
7
จ 22 ม.ค. 2018 7:20 pm โดย Parichat
งานประจำวันที่ 22 มกราคม 2561
โดย Four จ 22 ม.ค. 2018 9:48 am บอร์ด MT22 - อิษยา งามสอาด
1
32
จ 22 ม.ค. 2018 11:23 am โดย Four
งานประจำวันที่ 22 มกราคม 2561
โดย Jom07 จ 22 ม.ค. 2018 9:47 am บอร์ด MT23 - สุพรรษา พูลตา
2
19
จ 22 ม.ค. 2018 11:01 am โดย AePongsak
งานประจำวันที่ 19 มกราคาม 2561
โดย Parichat ศ 19 ม.ค. 2018 8:52 am บอร์ด MT21 - ปาริชาติ รัตโณภาส
1
8
ศ 19 ม.ค. 2018 7:33 pm โดย Parichat
งานประจำวันที่ 19 มกราคม 2561
โดย Jom07 ศ 19 ม.ค. 2018 8:43 am บอร์ด MT23 - สุพรรษา พูลตา
1
26
ศ 19 ม.ค. 2018 9:20 am โดย Jom07
งานประจำวันที่ 19 มกราคม 2561
โดย Four ศ 19 ม.ค. 2018 8:42 am บอร์ด MT22 - อิษยา งามสอาด
4
25
ศ 19 ม.ค. 2018 6:43 pm โดย Four
ตัวแปรชนิด Tuple
โดย Four พฤ 18 ม.ค. 2018 5:18 pm บอร์ด Python Knowledge
0
35
พฤ 18 ม.ค. 2018 5:18 pm โดย Four
ขอสอบถามเรื่องความแตกต่างของฟังก์ชั่นvariant_pow()กับฟังก์ชั่น pow()
โดย Parichat พฤ 18 ม.ค. 2018 1:58 pm บอร์ด Programming - PHP
0
31
พฤ 18 ม.ค. 2018 1:58 pm โดย Parichat
อยากได้โปรแกรม command แบบ cmd ที่เก็บ history ได้ค่ะช่วยเเนะนำหน่อย
โดย thatsawan พฤ 18 ม.ค. 2018 11:18 am บอร์ด ถาม - ตอบ คอมพิวเตอร์
2
60
พฤ 18 ม.ค. 2018 7:18 pm โดย thatsawan
0vsNULL
โดย Before Dong พฤ 18 ม.ค. 2018 10:32 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
1
45
พฤ 18 ม.ค. 2018 2:51 pm โดย Before Dong
งานประจำวันที่ 18 มกราคม 2561
โดย Parichat พฤ 18 ม.ค. 2018 9:38 am บอร์ด MT21 - ปาริชาติ รัตโณภาส
1
14
พฤ 18 ม.ค. 2018 7:16 pm โดย Parichat
งานประจำวันที่ 18 มกราคม 2561
โดย Jom07 พฤ 18 ม.ค. 2018 9:27 am บอร์ด MT23 - สุพรรษา พูลตา
2
34
พฤ 18 ม.ค. 2018 6:49 pm โดย Before Dong
งานประจำวันที่ 18 มกราคม 2561
โดย Four พฤ 18 ม.ค. 2018 9:24 am บอร์ด MT22 - อิษยา งามสอาด
1
23
พฤ 18 ม.ค. 2018 11:44 am โดย Four
VDO สอนพัฒนา Componet Joomla ภาษาอังกฤษ By Mindphp Developer Team
โดย mindphp พฤ 18 ม.ค. 2018 6:21 am บอร์ด Joomla Development
0
33
พฤ 18 ม.ค. 2018 6:21 am โดย mindphp
Ozio Gallery-Components & Plugins สำหรับช่วยให้ดูภาพที่เผยแพร่บน Googleและวีดีโอจาก Youtube ที่ละเอียด
โดย Parichat พ 17 ม.ค. 2018 7:30 pm บอร์ด Joomla Extension Review
0
54
พ 17 ม.ค. 2018 7:30 pm โดย Parichat
ตัวดำเนินการของตัวแปร List
โดย Four พ 17 ม.ค. 2018 4:35 pm บอร์ด Python Knowledge
0
36
พ 17 ม.ค. 2018 4:35 pm โดย Four
การใช้ Del statement
โดย Four พ 17 ม.ค. 2018 4:03 pm บอร์ด Python Knowledge
0
33
พ 17 ม.ค. 2018 4:03 pm โดย Four
Review Applications 17 มกราคม 2561
โดย Jom07 พ 17 ม.ค. 2018 3:44 pm บอร์ด MT23 - สุพรรษา พูลตา
1
18
พ 17 ม.ค. 2018 6:19 pm โดย Jom07