如何在數據庫中的座標變化一段時間後在谷歌地圖上設置標記？

我是網絡初學者，製作一個帶谷歌地圖和標記的網頁。管理員可以在一定的時間間隔之後監控發送其座標（經度，緯度）的移動設備的位置，這些座標存儲在具有特定ID的數據庫中。如何在數據庫中的座標變化一段時間後在谷歌地圖上設置標記？

coodinates變化時標記的位置應該改變，我無法理解它將如何完成。

我已經使php文件獲取座標，但不能理解如何進一步進行。

這是我到目前爲止做出的網頁：

<!DOCTYPE html> 
<html> 
    <head> 
    <style> 
     #map { width: 1000px;height: 500px;} 
    </style>   
    <script src="https://maps.googleapis.com/maps/api/js"></script> 

    <script> 
     var latlng = {lat: 31.54972, lng: 74.34361}; 
     function initialize() 
     { 
     var mapCanvas = document.getElementById('map'); 

     var mapOptions = 
     { 
      center: latlng, 
      zoom: 8, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     } 
     var map = new google.maps.Map(mapCanvas, mapOptions); 
     var marker = new google.maps.Marker({ 
      position: latlng, 
      title: "Hello World!" 
     }); 

     marker.setMap(map); 
     } 
     google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
    </head> 
    <body> 
    <div id="map"></div> 
    </body> 
</html>

，這裏是php文件，從數據庫中獲取座標：

<?php 
define('HOST','localhost'); 
    define('USER','root'); 
    define('PASS',''); 
    define('DB','coordinates'); 
    $con = mysqli_connect(HOST,USER,PASS,DB); 
    $id = $_GET['id']; 
    $query = "SELECT longitude,latitude FROM data"; 
    $qry_result = mysqli_query($con,$query) or die(mysqli_error());  
    // Insert a new row in the table for each person returned 
    while($row = mysqli_fetch_array($qry_result)) { 
    $longitude = $row['longitude']; 
    $latitide = $row['latitude'];   
    }    
?>

來源

2016-01-13 shamroz

這只是1標記，對不對？ 1手機發送數據，並且每次這個INSERT記錄到DB表中。所以在檢查時，我們只需要最後一個值。我理解正確嗎？ –

是的你正確 – shamroz

嗨，使用我的最新更新的代碼，我只是編輯它。讓我知道它是否適合你 –

好吧，我先告訴你的結果與測試數據，所以你看看地圖hehaves。

我添加jQuery來做Ajax調用。 Ajax可讓網頁瀏覽器瀏覽您網站上的任何頁面，而無需離開頁面。用戶沒有注意到任何事情發生

通過拉合爾線10分。 Cookies存儲索引（0到9）。

testdata.php

<?php 
    // this test loops a trajectory through Lahore, in 10 steps. 
    // every 10 steps it goes back to the start 
    // it's just test data, to show the map is working 
    // $start = 31.468885630398272,74.24052429199217 
    // $end = 31.572736162286912,74.43412613868712 
    $i = (isset($_COOKIE['i']) ? $_COOKIE['i'] + 1 : 0) % 10; 
    setcookie('i', $i); 
    echo json_encode(array(
    'lat'=>31.468885630398272 + (31.572736162286912 - 31.468885630398272) * $i/10, 
    'lng'=>74.24052429199217 + (74.43412613868712 - 74.24052429199217) * $i/10 
)); 
    exit; 
?>

的index.php

<!DOCTYPE html> 
<html> 
    <head> 
    <style> 
     #map { width: 1000px;height: 500px;} 
    </style> 
    <script src="https://maps.googleapis.com/maps/api/js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>   
    <script> 
     var latlng = {lat: 31.54972, lng: 74.34361}; 
     function initialize() { 
     var mapCanvas = document.getElementById('map'); 
     var mapOptions = { 
      center: latlng, 
      zoom: 8, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     } 
     var map = new google.maps.Map(mapCanvas, mapOptions); 
     var marker = new google.maps.Marker({ 
      position: latlng, 
      title: "Hello World!", 
      map: map // replaces marker.setMap(map); 
     }); 

     // now let's set a time interval, let's say every 3 seconds we check the position 
     setInterval(
      function() { 
      // we make an AJAX call 
      $.ajax({ 
       dataType: 'JSON', // this means the result (the echo) of the server will be readable as a javascript object 
       url: 'testdata.php', 
       success: function(data) { 
       // this is the return of the AJAX call. We can use data as a javascript object 

       // now we change the position of the marker 
       marker.setPosition({lat: Number(data.lat), lng: Number(data.lng)}); 

       } 
      }) 
      } 
      , 3000 // 3 seconds 
     ); 
     } 
     google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
    </head> 
    <body> 
    <div id="map"></div> 
    </body> 
</html>

所以，現在你真正的PHP文件。

調用它（例如）ajax.php。將index.php第31行的'testdata.php'更改爲'ajax.php'

我認爲應該是這樣，儘管我沒有用數據庫進行測試。自己檢查

我假設你有一個AUTOINCREMENT ID，但是這也可以用一個時間戳做，還是讓

ajax.php

<?php 
define('HOST','localhost'); 
define('USER','root'); 
define('PASS',''); 
define('DB','coordinates'); 

$con = mysqli_connect(HOST,USER,PASS,DB); 
$id = $_GET['id']; 

$query = "SELECT id, longitude, latitude FROM data ORDER BY id DESC LIMIT 1"; 
$qry_result = mysqli_query($con,$query) or die(mysqli_error());  
// Insert a new row in the table for each person returned 
if($row = mysqli_fetch_array($qry_result)) { // whenever you only need 1 record, use "if" instead of "while" 
    $longitude = $row['longitude']; 
    $latitude = $row['latitude']; 
    // echo the object 
    echo json_encode(array(
    'lat'=>$latitude, 
    'lng'=>$longitude 
    )); 
} 
exit;  
?>

來源

2016-01-13 12:27:17

如何在數據庫中的座標變化一段時間後在谷歌地圖上設置標記？

回答

相關問題