API ﯽﯾﺎﯿﻓﺍﺮﻐﺟ ﻥﺎﮑﻣ

فهرست مطالب

    نمایش فهرست مطالب

ﺪﯿﺑﺎﯿﺑ ﺍﺭ ﺮﺑﺭﺎﮐ ﺖﯿﻌﻗﻮﻣ

HTML Geolocation API ﺩﻮﺷ ﯽﻣ ﻩﺩﺎﻔﺘﺳﺍ ﺮﺑﺭﺎﮐ ﮏﯾ ﯽﯾﺎﯿﻓﺍﺮﻐﺟ ﺖﯿﻌﻗﻮﻣ ﻥﺩﺭﻭﺁ ﺖﺳﺪﺑ ﯼﺍﺮﺑ.

.ﺪﻨﮐ ﺪﯿﯾﺄﺗ ﺍﺭ ﻥﺁ ﺮﺑﺭﺎﮐ ﻪﮑﻨﯾﺍ ﺮﮕﻣ ﺖﺴﯿﻧ ﺱﺮﺘﺳﺩ ﺭﺩ ﺖﯿﻌﻗﻮﻣ ،ﺩﺯﺍﺪﻨﯿﺑ ﺮﻄﺧ ﻪﺑ ﺍﺭ ﯽﺻﻮﺼﺧ ﻢﯾﺮﺣ ﺪ

ﺪﯿﺷﺎﺑ ﻪﺘﺷﺍﺩ ﻪﺟﻮﺗ

.ﺖﺳﺍ ﻦﯾﺮﺗ ﻖﯿﻗﺩ ،ﺪﻨﻤﺷﻮﻫ ﯼﺎﻫ ﯽﺷﻮﮔ ﺪﻨﻧﺎﻣ ،GPS ﯼﺍﺭﺍﺩ ﯼﺎﻫ ﻩﺎﮕﺘﺳﺩ ﯼﺍﺮﺑ ﯽﯾﺎﯿﻓﺍﺮﻐﺟ ﻥﺎﮑﻣ

ﺮﮔﺭﻭﺮﻣ ﯽﻧﺎﺒﯿﺘﺸﭘ

Geolocation API ﺩﻮﺷ ﯽﻣ ﯽﻧﺎﺒﯿﺘﺸﭘ ﺎﻫﺮﮔﺭﻭﺮﻣ ﻪﻤﻫ ﺭﺩ:

Yes Yes Yes Yes Yes

ﺪﯿﺷﺎﺑ ﻪﺘﺷﺍﺩ ﻪﺟﻮﺗ

Geolocation API ﻪﻨﯿﻣﺯ ﯼﻭﺭ ﻂﻘﻓﯽﻣ ﺭﺎﮐ ﯽﻨﻣﺍ ﯼﺎﻫﺪﻨﮐ

ﺩﻮﺷ ﯽﻣ ﯽﻧﺎﺑﺰﯿﻣ (HTTP ﺪﻨﻧﺎﻣ) ﻦﻣﺍ ﺮﯿﻏ ﻊﺒﻨﻣ ﮏﯾ ﯼﻭﺭ ﺮﺑ ﺎﻤﺷ ﺖﯾﺎﺳ ﺮﮔﺍ

Geolocation API ﺯﺍ ﻩﺩﺎﻔﺘﺳﺍ ﺎﺑ

.ﺩﻮﺷ ﯽﻣ ﻩﺩﺎﻔﺘﺳﺍ ﺮﺑﺭﺎﮐ ﺖﯿﻌﻗﻮﻣ ﻥﺪﻧﺍﺩﺮﮔﺮﺑ ﯼﺍﺮﺑ getCurrentPosit

:ﺪﻧﺍﺩﺮﮔ ﯽﻣﺮﺑ ﺍﺭ ﺮﺑﺭﺎﮐ ﺖﯿﻌﻗﻮﻣ ﯽﯾﺎﯿﻓﺍﺮﻐﺟ ﺽﺮﻋ ﻭ ﻝﻮﻃ ﺮﯾﺯ ﻝﺎﺜﻣ

ﻝﺎﺜﻣ

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

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Geolocation API</h2>
<p>Click the button to get your coordinates.</p>

<button onclick="getLocation()">Try It</button>

<p id="demo"></p>

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

:ﻩﺪﺷ ﻩﺩﺍﺩ ﺢﯿﺿﻮﺗ ﻝﺎﺜﻣ

  • ﺩﻮﺷ ﯽﻣ ﯽﻧﺎﺒﯿﺘﺸﭘ ﯽﯾﺎﯿﻓﺍﺮﻐﺟ ﺖﯿﻌﻗﻮﻣ ﺎﯾﺁ ﻪﮐ ﺪﯿﻨﮐ ﯽﺳﺭﺮﺑ

  • ﺪﯿﻫﺩ ﺶﯾﺎﻤﻧ ﺮﺑﺭﺎﮐ ﻪﺑ ﯽﻣﺎﯿﭘ ﺕﺭﻮﺻ ﻦﯾﺍ ﺮﯿﻏ ﺭﺩ .ﺪﯿﻨﮐ ﺍﺮﺟﺍ ﺍﺭ getCurrentPosition() ﺪﺘﻣ ،ﯽﻧﺎ

  • .ﺪﻧﺍﺩﺮﮔ ﯽﻣﺮﺑ (showPosition) ﺮﺘﻣﺍﺭﺎﭘ ﺭﺩ ﻩﺪﺷ ﺺﺨﺸﻣ ﻊﺑﺎﺗ ﻪﺑ ﺍﺭ ﺕﺎﺼﺘﺨﻣ ﯽﺷ ﮏﯾ ،ﺪﺷﺎﺑ ﻖﻓﻮﻣ()

  • ﺪﻫﺩ ﯽﻣ ﯽﺟﻭﺮﺧ ﺍﺭ Longitude ﻭ showPosition() Latitude ﻊﺑﺎﺗ

.ﺎﻄﺧ ﻪﺑ ﯽﮔﺪﯿﺳﺭ ﻥﻭﺪﺑ ،ﺖﺳﺍ ﯽﯾﺍﺪﺘﺑﺍ ﺭﺎﯿﺴﺑ Geolocation ﺖﭙﯾﺮﮑﺳﺍ ﮏﯾ ﻻﺎﺑ ﻝﺎﺜﻣ

ﺎﻫﺩﺭ ﻭ ﺎﻫﺎﻄﺧ ﻪﺑ ﯽﮔﺪﯿﺳﺭ

ﺩﻮﺷ ﯽﻣ ﻩﺩﺎﻔﺘﺳﺍ ﺖﯾﺮﯾﺪﻣ ﯼﺍﺮﺑ getCurrentPosition() ﺵﻭﺭ

ﻝﺎﺜﻣ

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

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Geolocation API</h2>
<p>Click the button to get your coordinates.</p>

<button onclick="getLocation()">Try It</button>

<p id="demo"></p>

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

ﻪﺸﻘﻧ ﺭﺩ ﻪﺠﯿﺘﻧ ﺶﯾﺎﻤﻧ

ﺪﯿﺷﺎﺑ ﻪﺘﺷﺍﺩ ﯽﺳﺮﺘﺳﺩ Google ﺪﻨﻧﺎﻣ ﻪﺸﻘﻧ ﺲﯾﻭﺮﺳ ﮏﯾ ﻪﺑ ﺪﯾﺎﺑ ،ﻪﺸﻘﻧ ﺭﺩ ﻪﺠﯿﺘﻧ ﺶﯾﺎﻤﻧ ﯼﺍﺮﺑ

ﺩﻮﺷ ﯽﻣ ﻩﺩﺎﻔﺘﺳﺍ ﻞﮔﻮﮔ ﺭﺩ ﻥﺎﮑﻣ ﻥﺩﺍﺩ ﻥﺎﺸﻧ ﯼﺍﺮﺑ ﯽﺘﺸﮔﺯﺎﺑ ﯽﯾﺎﯿﻓﺍﺮﻐﺟ ﺽﺮﻋ ﻭ ﻝﻮﻃ ،ﺮﯾﺯ ﻝﺎﺜﻣ ﺭﺩ

ﻝﺎﺜﻣ

function showPosition(position) {
  let latlon = position.coords.latitude + "," + position.coords.longitude;

   let img_url = "https://maps.googleapis.com/maps/api/staticmap?center=
   "+latlon+"&zoom=14&size=400x300&sensor=false&key=YOUR_KEY";

   document.getElementById("mapholder").innerHTML = "<img src='"+img_url+"'>";
 }

ﻦﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﺕﺩﻮﺧ

<!DOCTYPE html>
<html>
<body>
<h1>HTML Geolocation</h1>
<p id="demo">Click the button to get your position.</p>

<button onclick="getLocation()">Try It</button>

<div id="mapholder"></div>

<script>
const 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) {
  let latlon = position.coords.latitude + "," + position.coords.longitude;
  let img_url = "https://maps.googleapis.com/maps/api/staticmap?center="
  +latlon+"&zoom=14&size=400x300&key=AIzaSyBu-916DdpKAjTmJNIgngS6HL_kDIKU0aU";
  document.getElementById("mapholder").innerHTML = "<img src='"+img_url+"'>";
}
//To use this code on your website, get a free API key from Google.
//Read more at: https://www.w3schools.com/graphics/google_maps_basic.asp

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>

.ﻥﺪﯿﺸﮐ ﻭ ﯽﯾﺎﻤﻨﮔﺭﺰﺑ ،ﺮﮕﻧﺎﺸﻧ ﯼﺎﻫ ﻪﻨﯾﺰﮔ ﺎﺑ ﻞﮔﻮﮔ ﯽﻠﻣﺎﻌﺗ ﻪﺸﻘﻧ ﺶﯾﺎﻤﻧ ﻩﻮﺤﻧ

ﻞﮔﻮﮔ ﻪﺸﻘﻧ ﺖﭙﯾﺮﮑﺳﺍ

<!DOCTYPE html>
<html>
<body>
<h1>HTML Geolocation</h1>
<p id="demo">Click the button to get your position.</p>

<button onclick="getLocation()">Try It</button>

<div id="mapholder"></div>

<script src="https://maps.google.com/maps/api/js?key=AIzaSyBu-916DdpKAjTmJNIgngS6HL_kDIKU0aU"></script>
<!--
To use this code on your website, get a free API key from Google.
Read more at: https://www.w3schools.com/graphics/google_maps_basic.asp
-->
<script>
const 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) {
  let lat = position.coords.latitude;
  let lon = position.coords.longitude;
  const latlon = new google.maps.LatLng(lat, lon)
  const mapholder = document.getElementById('mapholder')
  mapholder.style.height = '250px';
  mapholder.style.width = '500px';

  var myOptions = {
    center:latlon,zoom:14,
    mapTypeId:google.maps.MapTypeId.ROADMAP,
    mapTypeControl:false,
    navigationControlOptions:{style:google.maps.NavigationControlStyle.SMALL}
  }
    
  const map = new google.maps.Map(document.getElementById("mapholder"), myOptions);
  const marker = new google.maps.Marker({position:latlon,map:map,title:"You are here!"});
}

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>

ﻥﺎﮑﻣ ﻪﺑ ﻁﻮﺑﺮﻣ ﺕﺎﻋﻼﻃﺍ

.ﺖﺳﺍ ﻩﺪﺷ ﻩﺩﺍﺩ ﻥﺎﺸﻧ ﻪﺸﻘﻧ ﯼﻭﺭ ﺮﺑ ﺮﺑﺭﺎﮐ ﺖﯿﻌﻗﻮﻣ ﺶﯾﺎﻤﻧ ﻩﻮﺤﻧ ﻪﺤﻔﺻ ﻦﯾﺍ ﺭﺩ

:ﺪﻨﻧﺎﻣ ،ﺖﺳﺍ ﺪﯿﻔﻣ ﺭﺎﯿﺴﺑ ﻥﺎﮑﻣ ﻪﺑ ﻁﻮﺑﺮﻣ ﺕﺎﻋﻼﻃﺍ ﯼﺍﺮﺑ ﻦﯿﻨﭽﻤﻫ ﯽﯾﺎﯿﻓﺍﺮﻐﺟ ﺖﯿﻌﻗﻮﻣ

  • ﺯﻭﺭ ﻪﺑ ﯽﻠﺤﻣ ﺕﺎﻋﻼﻃﺍ

  • ﺮﺑﺭﺎﮐ ﯽﮑﯾﺩﺰﻧ ﺭﺩ ﻪﻗﻼﻋ ﺩﺭﻮﻣ ﻁﺎﻘﻧ ﺶﯾﺎﻤﻧ

  • (GPS) ﻡﺎﮔ ﻪﺑ ﻡﺎﮔ ﯼﺮﺑﻭﺎﻧ

ﺪﻧﺍﺩﺮﮔﺮﺑ ﺍﺭ ﺎﻫ ﻩﺩﺍﺩ -() getCurrentPosition ﺪﺘﻣ

،ﯽﯾﺎﯿﻓﺍﺮﻐﺟ ﺽﺮﻋ .ﺪﻧﺍﺩﺮﮔ ﯽﻣﺮﺑ ﺖﯿﻘﻓﻮﻣ ﺕﺭﻮﺻ ﺭﺩ ﺍﺭ ﯽﺷ ﮏﯾ getCurr

coords.latitude

(ﺩﻮﺷ ﯽﻣ ﻩﺪﻧﺍﺩﺮﮔﺮﺑ ﻪﺸﯿﻤﻫ) ﯼﺭﺎﺸﻋﺍ ﺩﺪﻋ ﮏﯾ ﻥﺍﻮﻨﻋ ﻪﺑ ﯽﯾﺎﯿﻓﺍﺮﻐﺟ ﺽﺮﻋ

coords.longitude

(ﺩﻮﺷ ﯽﻣ ﻩﺪﻧﺍﺩﺮﮔﺮﺑ ﻪﺸﯿﻤﻫ) ﯼﺭﺎﺸﻋﺍ ﺩﺪﻋ ﮏﯾ ﻥﺍﻮﻨﻋ ﻪﺑ ﯽﯾﺎﯿﻓﺍﺮﻐﺟ ﻝﻮﻃ

coords.accuracy

(ﺩﻮﺷ ﯽﻣ ﻩﺪﻧﺍﺩﺮﮔﺮﺑ ﻪﺸﯿﻤﻫ) ﺖﯿﻌﻗﻮﻣ ﺖﻗﺩ

coords.altitude

(ﺩﻮﺷ ﯽﻣ ﻩﺪﻧﺍﺩﺮﮔﺮﺑ ﺩﻮﺟﻭ ﺕﺭﻮﺻ ﺭﺩ) ﺎﯾﺭﺩ ﻂﺳﻮﺘﻣ ﺢﻄﺳ ﺯﺍ ﺮﺗﻻﺎﺑ ﺮﺘﻣ ﺐﺴﺣ ﺮﺑ ﻉﺎﻔﺗﺭﺍ

coords.altitudeAccuracy

(ﺩﻮﺷ ﯽﻣ ﻩﺪﻧﺍﺩﺮﮔﺮﺑ ﺩﻮﺟﻭ ﺕﺭﻮﺻ ﺭﺩ) ﺖﯿﻌﻗﻮﻣ ﻉﺎﻔﺗﺭﺍ ﺖﻗﺩ

coords.heading

(ﺩﻮﺷ ﯽﻣ ﻩﺪﻧﺍﺩﺮﮔﺮﺑ ﺩﻮﺟﻭ ﺕﺭﻮﺻ ﺭﺩ) ﻝﺎﻤﺷ ﺯﺍ ﺖﻋﺎﺳ ﯼﺎﻫ ﻪﺑﺮﻘﻋ ﺖﻬﺟ ﺭﺩ ﻪﺟﺭﺩ ﺕﺭﻮﺻ ﻪﺑ ﻥﺍﻮﻨﻋ

coords.speed

(ﺩﻮﺷ ﯽﻣ ﻩﺪﻧﺍﺩﺮﮔﺮﺑ ﺩﻮﺟﻭ ﺕﺭﻮﺻ ﺭﺩ) ﻪﯿﻧﺎﺛ ﺮﺑ ﺮﺘﻣ ﺐﺴﺣ ﺮﺑ ﺖﻋﺮﺳ

timestamp

(ﺩﻮﺷ ﯽﻣ ﻩﺪﻧﺍﺩﺮﮔﺮﺑ ﺩﻮﺟﻭ ﺕﺭﻮﺻ ﺭﺩ) ﺦﺳﺎﭘ ﻥﺎﻣﺯ/ﺦﯾﺭﺎﺗ

ﺮﮕﯾﺩ ﺐﻟﺎﺟ ﯼﺎﻫ ﺵﻭﺭ - ﯽﯾﺎﯿﻓﺍﺮﻐﺟ ﯽﺑﺎﯾ ﻥﺎﮑﻣ ﯽﺷ

:ﺩﺭﺍﺩ ﺰﯿﻧ ﯼﺮﮕﯾﺩ ﺐﻟﺎﺟ ﯼﺎﻫ ﺵﻭﺭ Geolocation ﯽﺷ

  • watchPosition() - ﯽﻣﺮﺑ ﺍﺭ ﺮﺑﺭﺎﮐ ﯽﻠﻌﻓ ﺖﯿﻌﻗﻮﻣﻪﺑ ﻭ

  • clearWatch() - ﺵﻭﺭ watchPo

ﺪﻨﻧﺎﻣ) ﺪﯾﺭﺍﺩ ﺯﺎﯿﻧ ﻖﯿﻗﺩ GPS ﻩﺎﮕﺘﺳﺩ ﮏﯾ ﻪﺑ ﺩﺭﻮﻣ ﻦﯾﺍ ﺶﯾﺎﻣﺯﺁ ﯼﺍﺮﺑ .ﺪﻫﺩ ﯽﻣ ﻥﺎﺸﻧ ﺍﺭ

ﻝﺎﺜﻣ

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

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Geolocation API</h2>
<p>Click the button to get your coordinates.</p>

<button onclick="getLocation()">Try It</button>

<p id="demo"></p>

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

</body>
</html>

تمامی حقوق محفوظ است. © BasicIT.org • 2023-2024