HTML5 地理定位

  • ຫົວທາງເບື້ອງຫລັງ HTML5 迁移
  • ຫົວທາງເບື້ອງຫລັງ HTML5 拖放

HTML5 Geolocation (ການບັນດາການອາຍາການ) ສຳລັບການບັນດາການອາຍາການຂອງຜູ້ນຳໃຊ້.

ທ້າທາຍທີ່ທີ່ເຈົ້າຈະສະແດງການບັນດາການອາຍາການຂອງເຈົ້າໃນຮູບແບບກາກສາຂາກາກ.

ການບັນດາການອາຍາການຂອງຜູ້ນຳໃຊ້

API HTML5 Geolocation ຂອງ HTML5 ສຳລັບການຮັບຂໍ້ມູນທາງລະບາຍຂອງຜູ້ນຳໃຊ້.

ຍ້ອນວ່າການໃຊ້ປະກອບປະກອບນີ້ອາດຈະລະເມີດຄວາມລັບຂອງຜູ້ນຳໃຊ້, ຂໍ້ມູນການບັນດາການອາຍາການຂອງຜູ້ນຳໃຊ້ບໍ່ສາມາດໃຊ້ໄດ້ຖ້າບໍ່ມີຄວາມຍິນຍອມຈາກຜູ້ນຳໃຊ້.

ການສະໜັບສະໜູນບັນດາການອາຍາການ.

Internet Explorer 9, Firefox, Chrome, Safari ແລະ Opera ສະໜັບສະໜູນການບັນດາການອາຍາການ.

ຄວາມເຫັນ:ສຳລັບອຸປະກອນທີ່ມີ GPS ເຊັ່ນ iPhone, ການບັນດາການອາຍາການຈະມີຄວາມສຳຄັນຫຼາຍກວ່າ.

HTML5 - ການບັນດາການອາຍາການທີ່ບັນດາການອາຍາການ.

ຂອບໃຫ້ນຳໃຊ້ຫຼັກການgetCurrentPosition() ເພື່ອຮັບການບັນດາການອາຍາການຂອງຜູ້ນຳໃຊ້.

ຕົວຢ່າງດັ່ງກ່າວນີ້ແມ່ນຕົວຢ່າງການບັນດາການອາຍາການທີ່ຫຼັງສັນຕິພາບຂອງຜູ້ນຳໃຊ້.

ຕົວຢ່າງ

<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>

ທົດລອງຄົນທັງຫນັງ

ຕົວຢ່າງທີ່ສະໜັບສະໜູນ:

  • ກວດສອບວ່າມີການສະໜັບສະໜູນການບັນດາການອາຍາການ.
  • ຖ້າມີການສະໜັບສະໜູນການgetCurrentPosition() ຈະດຳເນີນຫຼັກການgetCurrentPosition(). ຖ້າບໍ່ມີການສະໜັບສະໜູນຈະສະແດງຂໍ້ຄວາມໃຫ້ຜູ້ນຳໃຊ້.
  • ຖ້າgetCurrentPosition() ດຳເນີນງານສຳເລັດແລ້ວຈະປະຕິເສດສຳລັບຫຼັກການshowPosition() ທີ່ກໍານົດຄວາມສະເພາະ.
  • ຫຼັກການshowPosition() ໄດ້ຮັບແລະສະແດງສຳລັບການຄັດພິມາດຕາວັດທີ່ຫຼັງສັນຕິພາບ.

ຕົວຢ່າງດັ່ງກ່າວນີ້ແມ່ນລະບົບການບັນດາການອາຍາການທີ່ມີພື້ນຖານດຽວພຽງຢ່າງນັ້ນບໍ່ມີການຈັດການຄວາມຜິດພາດ.

ຈັດການຄວາມຜິດພາດແລະປະຕິເສດ

ຄວາມສະເພາະຂອງຫຼັກການgetCurrentPosition() ຂອງສະເພາະທີສອງໃຊ້ສຳລັບຈັດການຄວາມຜິດພາດ. ມັນປະກອບຢູ່ວ່າ: ການບັນດາການອາຍາການບໍ່ສາມາດໃຊ້ຖ້າການບັນດາການອາຍາການບໍ່ສາມາດໃຊ້.

ຕົວຢ່າງ

function showError(error)
  {
  switch(error.code)
    {
    case error.PERMISSION_DENIED:
      x.innerHTML="ຜູ້ນຳໃຊ້ປະຕິເສດການຮ້ອງຂໍການບັນດາການອາຍາການ."
      break;
    case error.POSITION_UNAVAILABLE:
      x.innerHTML="ຂໍ້ມູນການບັນດາການອາຍາການບໍ່ສາມາດໃຊ້."
      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;
    }
  }

ທົດລອງຄົນທັງຫນັງ

ລະຫັດຜົນການສົງໄສ:

  • Permission denied - ຜູ້ນຳທາງບໍ່ອະນຸຍາດ
  • Position unavailable - ບໍ່ສາມາດຮັບທີ່ຕັ້ງຂອງຕອນກຳລັງ
  • Timeout - ການດຳເນີນການຫລຸດເວລາ

ສະແດງບັນດາວັດຖຸຕົວແທນໃນບັນດາສະແດງ

ສຳລັບການສະແດງບັນດາວັດຖຸຕົວແທນໃນບັນດາບັນດາສະແດງທີ່ສາມາດນຳທາງສາມາດ

ຕົວຢ່າງ

function showPosition(position)
{
var latlon=position.coords.latitude+","+position.coords.longitude;
var img_url="http://maps.googleapis.com/maps/api/staticmap?center="
+latlon+"&zoom=14&size=400x300&sensor=false";
document.getElementById("mapholder").innerHTML="<img src='"+img_url+"' />";
}

ທົດລອງຄົນທັງຫນັງ

ໃນກໍລະນີທີ່ພວກເຮົາພິຈາລະນາວັດທະນາຍານທາງວັດທະນາຍານທີ່ຈະສະແດງທີ່ກູໂກ (ສະແດງພາບສະຖານທີ່ທີ່ບໍ່ໄດ້ດຳເນີນໄປ)

ການຫລັກການຈາກກູໂກ

ກ່ອນນີ້ກໍານົດການທີ່ຈະສະແດງບັນດາບັນດາສະແດງສະແດງບວກພາບຕັ້ງທີ່ສາມາດນຳທາງສາມາດ

ຂໍ້ມູນທີ່ມີຢູ່ທີ່ຕັ້ງ

ບ່ອນນີ້ສະແດງວ່າບວກພາບຕັ້ງຂອງຜູ້ນຳທາງໃນບັນດາບັນດາສະແດງສະແດງບວກພາບຕັ້ງຂອງຜູ້ນຳທາງໃນບັນດາບັນດາສະແດງ

ກໍລະນີຄົງນວນ:

  • ການປັບປຸງຂໍ້ມູນທ້ອງຖິ່ນ
  • ສະແດງບັນດາສະຖານທີ່ຂອງຜູ້ນຳທາງທີ່ສາມາດ
  • ລະບົບການນຳທາງທີ່ສາມາດສາມາດນຳທາງສາມາດ

getCurrentPosition() ຂັດແຍກບັນດາວັດຖຸຕົວແທນ - ຄວາມຖືກກັບຂໍ້ມູນ

ຖ້າປະສົບຜົນສຳເລັດຫລັງຈາກການໂຫລດ getCurrentPosition() ຂັດແຍກບັນດາວັດຖຸຕົວແທນຫລັງຈາກການໂຫລດ getCurrentPosition() ຂັດແຍກບັນດາວັດຖຸຕົວແທນຫລັງຈາກການໂຫລດ getCurrentPosition()

ປະກອບ ອະທິບາຍ
coords.latitude ວັດທະນະວັດທະນາຍານວຽງຕາມລະດັບຄວາມສາມາດ
coords.longitude ວັດທະນະວັດທະນາຍານດາວທະວີ
coords.accuracy ຄວາມສາມາດຕາມລະດັບຄວາມສາມາດຕາມລະດັບຄວາມສາມາດ
coords.altitude ຄວາມສາມາດຕາມລະດັບຄວາມສູນຄວາມສາມາດຕາມລະດັບຄວາມສູນຄວາມສາມາດຕາມລະດັບຄວາມສູນ
coords.altitudeAccuracy 位置的海拔精度
coords.heading 方向，从正北开始以度计
coords.speed 速度，以米/每秒计
timestamp 响应的日期/时间

Geolocation 对象 - 其他有趣的方法

watchPosition() - 返回用户的当前位置，并继续返回用户移动时的更新位置（就像汽车上的 GPS）。

clearWatch() - ຢຸດ watchPosition() ການ

ຕົວຢ່າງທີ່ຕໍ່າຂອງ watchPosition() ການ. ທ່ານຕ້ອງມີອຸປະກອນ GPS ສະຖານະພາບຫນັງທີ່ມີຄວາມຖືກຕ້ອງ (ເຊັ່ນ iPhone) ເພື່ອທົດລອງຕົວຢ່າງນີ້:

ຕົວຢ່າງ

<script>
var x=document.getElementById("demo");
function getLocation()
  {
  if (navigator.geolocation)
    {
    navigator.geolocation.watchPosition(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>

ທົດລອງຄົນທັງຫນັງ

  • ຫົວທາງເບື້ອງຫລັງ HTML5 迁移
  • ຫົວທາງເບື້ອງຫລັງ HTML5 拖放