improve geo location with jquery in html5?

Viewed 451

I have the following full-code working.. the script retrieves the Latitude and Longitude every 3 seconds for a Car in movement, and save the data into a mysql table. Even with the GPS running on the phone the accuracy is not so good. I add the Options Var so the i can enableHighAccuracy: true .

but the accuracy still very bad when i draw the map:

enter image description here

is there a way to improve this?

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <title></title>
    <script type="text/javascript" src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js?ver=3.3.1'></script>
</head>
<body style="text-align: center">
    <button style="font-size:30px" id="find_btn">Find Me</button>
    <div id="result"></div>
    <br>
    <div id="resp"></div>
    <br>

    <button style="font-size:30px" id="stop_btn">STOP</button>

    <script type="text/javascript">
    function SaveLatLng(lat,lng) {
        var url = "saveLatLng.php";
        $.ajax({                        
           type: "POST",                 
           url: url,                     
           data: {latitude:lat,longitude:lng}, 
           success: function(data) {
               $('#resp').html(data);               
           }
       });
    };

    var options = {
        enableHighAccuracy: true,
        timeout: 5000,
        maximumAge: 0
    };

    function error(err) {
        console.warn(`ERROR(${err.code}): ${err.message}`);
    }

    function randomQuote() { //user clicks button
        if ("geolocation" in navigator) { //check geolocation available 
            //try to get user current location using getCurrentPosition() method
            navigator.geolocation.getCurrentPosition(function(position){ 
                $("#result").html("Found your location <br />Lat : "+position.coords.latitude+" </br>Lang :"+ position.coords.longitude);
                SaveLatLng(position.coords.latitude,position.coords.longitude);
            }, error, options);
        } else {
            console.log("Browser doesn't support geolocation!");
        }
    };

    var interval = null;
    $("#find_btn").click(function () { 
        interval = setInterval(randomQuote, 3000);
    });    

    $("#stop_btn").click(function () { 
        clearInterval(interval);
    });
</script>
</body>
</html>
1 Answers

Use watchPosition instead of getCurrentPosition every 3 secs. The later is optimized to return quickly at the possible expense of accuracy. Also you can check the accuracy (in meters) of the returned value and decide it is too inaccurate and ignore it.

You may also want to consider other position-filtering detailed here Min-distance, min-time etc

Related