开发者

Geolocation JSF

开发者 https://www.devze.com 2023-03-15 17:11 出处:网络
Do开发者_开发百科es anyone have an example of sending a geolocation from a mobile phone to a JSF backing bean?

Do开发者_开发百科es anyone have an example of sending a geolocation from a mobile phone to a JSF backing bean?

Would like to get the customers address using geolocation? (Will need to convert from geolocation co-ordinates to a drop down list of nearby roads).

Thanks, D


Not sure if this will help u get started...

This pulls GPS Geolocation Data from Mobile Devices into a Form... Then do whatever with it from there...

 <script type="text/javascript"> 
 function getLocationConstant()
{
    if(navigator.geolocation)
    {
        navigator.geolocation.getCurrentPosition(onGeoSuccess,onGeoError);  
    } else {
        alert("Your browser or device doesn't support Geolocation");
    }
}

// If we have a successful location update
function onGeoSuccess(event)
{
    document.getElementById("Latitude").value =  event.coords.latitude; 
    document.getElementById("Longitude").value = event.coords.longitude;

}

// If something has gone wrong with the geolocation request
function onGeoError(event)
{
    alert("Error code " + event.code + ". " + event.message);
}
 </script>


 <cfform action="gps2.cfm" method="post">
 Latitude: <input type="text" id="Latitude" name="Latitude" value="">
 <br><br>
 Longitude: <input type="text" id="Longitude" name="Longitude" value="">
 <br><br>
 <input type="button" value="Get Location" onclick="getLocationConstant()"/>
 <br><br>
 <input type="submit" value="Add GPS Location" class=small>
 </cfform>


View this links please:

https://developers.google.com/maps/documentation/javascript/examples/map-geolocation - Google Developers

https://goo.gl/TD7aiq - JsFiddle

JS:

// Note: This example requires that you consent to location sharing when
// prompted by your browser. If you see the error "The Geolocation service
// failed.", it means you probably did not give permission for the browser to
// locate you.
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 6
});
var infoWindow = new google.maps.InfoWindow({map: map});
// Try HTML5 geolocation.
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
  var pos = {
    lat: position.coords.latitude,
    lng: position.coords.longitude
  };
  infoWindow.setPosition(pos);
  infoWindow.setContent('Location found.');
  map.setCenter(pos);
  }, function() {
  handleLocationError(true, infoWindow, map.getCenter());
  });
  } else {
  // Browser doesn't support Geolocation
  handleLocationError(false, infoWindow, map.getCenter());
  }
}
  function handleLocationError(browserHasGeolocation, infoWindow, pos) {
  infoWindow.setPosition(pos);
  infoWindow.setContent(browserHasGeolocation ?
                    'Error: The Geolocation service failed.' :
                    'Error: Your browser doesn\'t support geolocation.');
   }


Using the Javascript you can get the co-ordinates and you can set the backend variable using document.getElementById("id")) in javascript.

Example:

 <h:inputText value="{myBean.latitude}" id="latitudeID" />



<!DOCTYPE html>
<html>
<body>
<p>Click the button to get your coordinates.</p>

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

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

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

    document.getElementById("formName:latitudeID").value=position.coords.latitude; /* this will set the value in variable */ 
}
</script>
</body>
</html>
0

精彩评论

暂无评论...
验证码 换一张
取 消