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

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
R - mod_jshopping_products_reviews โมดูลการรีวิวสินค้า
โดย pprn พฤ 20 ก.ย. 2018 6:58 pm บอร์ด MT25 - นางสาวปรียากมล รินนาศักดิ์
1
6
พฤ 20 ก.ย. 2018 7:02 pm โดย pprn
phpbb ติดตั้งภาษาไทยไม่ได้
โดย Ittichai_chupol พฤ 20 ก.ย. 2018 6:52 pm บอร์ด Programming - PHP
0
5
พฤ 20 ก.ย. 2018 6:52 pm โดย Ittichai_chupol
R-mdsoft_create_generate_opening_entries
โดย tatiya พฤ 20 ก.ย. 2018 6:36 pm บอร์ด M065 - ตติยะ นาชัย
1
6
พฤ 20 ก.ย. 2018 9:42 pm โดย tatiya
R-mdsoft_change_product_type_stockable
โดย tatiya พฤ 20 ก.ย. 2018 6:32 pm บอร์ด M065 - ตติยะ นาชัย
1
8
พฤ 20 ก.ย. 2018 9:08 pm โดย tatiya
phpbb ubuntu ติดตั้งอย่างไร
โดย Ittichai_chupol พฤ 20 ก.ย. 2018 5:13 pm บอร์ด Programming - PHP
3
11
พฤ 20 ก.ย. 2018 5:38 pm โดย Ittichai_chupol
แนะนำ จังหวัดจันทบุรี จากคำขวัญ ส่วนที่ 1
โดย Ittichai_chupol พฤ 20 ก.ย. 2018 4:17 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
8
พฤ 20 ก.ย. 2018 4:17 pm โดย Ittichai_chupol
อยากจะทราบว่า ทำอย่างไรให้สามารถ รัน php บน ubuntu
โดย Ittichai_chupol พฤ 20 ก.ย. 2018 4:10 pm บอร์ด Programming - PHP
0
6
พฤ 20 ก.ย. 2018 4:10 pm โดย Ittichai_chupol
บันทึกการรับสินค้า โดยการกรองราคาสินค้า พร้อมคำนวนต้นทุนเฉลีย php
โดย Ittichai_chupol พฤ 20 ก.ย. 2018 3:09 pm บอร์ด PHP Knowledge
0
7
พฤ 20 ก.ย. 2018 3:09 pm โดย Ittichai_chupol
php การตรวจสอบการชำระเงินค่าสินค้าเกินกำหนด
โดย Ittichai_chupol พฤ 20 ก.ย. 2018 1:56 pm บอร์ด PHP Knowledge
0
11
พฤ 20 ก.ย. 2018 1:56 pm โดย Ittichai_chupol
php function แปลงวันที่จากฐานข้อมูล เป็นวันที่ แบบไทย อย่างง่าย
โดย Ittichai_chupol พฤ 20 ก.ย. 2018 10:35 am บอร์ด Programming - PHP
0
13
พฤ 20 ก.ย. 2018 10:35 am โดย Ittichai_chupol
งานประจำวันที่ 20 กันยายน 2561
โดย prakon พฤ 20 ก.ย. 2018 10:16 am บอร์ด MT24 - นายปกรณ์ วิริยะธนวิโรจน์
1
28
พฤ 20 ก.ย. 2018 10:17 am โดย prakon
งานประจำวันที่ 20 กันยายน 2561
โดย pprn พฤ 20 ก.ย. 2018 10:11 am บอร์ด MT25 - นางสาวปรียากมล รินนาศักดิ์
1
11
พฤ 20 ก.ย. 2018 7:10 pm โดย pprn
งานประจำวันที่ 20 กันยายน 2561
โดย muneela พฤ 20 ก.ย. 2018 10:10 am บอร์ด M068 - มุนีลา หมัดบาซา
1
7
พฤ 20 ก.ย. 2018 7:04 pm โดย muneela
งานประจำวันที่ 20 กันยายน 2561
โดย tai14 พฤ 20 ก.ย. 2018 10:03 am บอร์ด MT26 - นางสาวอัครยุภา ยงยุทธ
1
4
พฤ 20 ก.ย. 2018 7:02 pm โดย tai14
งานประจำวันที่ 20 กันยายน 2561
โดย Ittichai_chupol พฤ 20 ก.ย. 2018 9:58 am บอร์ด M070 - อิทธิชัย ชูผล
1
9
พฤ 20 ก.ย. 2018 7:05 pm โดย Ittichai_chupol
งานประจำวันที่ 20 กันยายน 2561
โดย tatiya พฤ 20 ก.ย. 2018 9:23 am บอร์ด M065 - ตติยะ นาชัย
0
5
พฤ 20 ก.ย. 2018 9:23 am โดย tatiya
checkbox พร้อมกรองจำนวน
โดย Ittichai_chupol พ 19 ก.ย. 2018 5:49 pm บอร์ด Programming - PHP
0
28
พ 19 ก.ย. 2018 5:49 pm โดย Ittichai_chupol
การทำแผ่นรองเมาส์สำหรับวัยทำงานแบบง่าย
โดย Ittichai_chupol พ 19 ก.ย. 2018 4:53 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
23
พ 19 ก.ย. 2018 4:53 pm โดย Ittichai_chupol
การทำข้าวขย้ำกล้วย ให้เด็ก อายุ 3 - 6 เดือน
โดย Ittichai_chupol พ 19 ก.ย. 2018 4:51 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
12
พ 19 ก.ย. 2018 4:51 pm โดย Ittichai_chupol
สถานที่ท่องเทียวน่าสนใจ อุทยานแห่งชาติน้ำตกพลิ้ว จังหวัดจันทบุรี
โดย Ittichai_chupol พ 19 ก.ย. 2018 4:48 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
12
พ 19 ก.ย. 2018 4:48 pm โดย Ittichai_chupol