2

事前定義された一連の座標に従って、Google マップでバスの移動をシミュレートするサイトを開発しようとしています。PHP、HTML、Javascript (Google Maps API) に取り組んでいます。座標を保持するデータベースは localhost にあります。私の質問は、データベース内のすべての座標に向かって移動するバスの実際のシミュレーションに関係しています。

説明するには: データベースは次のようになります。

 id    latt       lon
 1.   53.4877   -2.27519
 2.   53.4859   -2.27489

など 14件のエントリーがあります。

データベースに接続する PHP スクリプト:

<?php
$host = "localhost";
$user = "hidden";
$pass = "";

$databaseName = "database";
$tableName = "locations";


$con = mysql_connect($host, $user, $pass);
$dbs = mysql_select_db($databaseName, $con);

$result = mysql_query("SELECT * FROM $tableName");

$data = array();

while ($row = mysql_fetch_row($result)) {
    $data[] = $row;
}  

echo json_encode($data);
?>

JavaScript 関数:

    function moveBus(map, marker) 
        {

            $.ajax({                                      
                url: 'api2.php',                           
                data: "",                        

                dataType: 'json',                
                async: false,     
                success: function(data)          
                {

                    for (var i in data)
                    {
                        var row = data[i];             
                        var latt = row[1];           
                        var lon = row[2]; 

                        moveMarker(map, marker, latt, lon);
                    }
                } 
            })    
        }; 

moveMarker 関数:

        function moveMarker( map, marker, latt, lon) {

        setTimeout( function(){ marker.setPosition( new google.maps.LatLng( latt ,       lon  ) ); }, 3500 );
        };

理解できるように、ループが終了した後、そこに到達するまでのルート全体を表示するのではなく、最後の座標セットでバス マーカーを送信するだけです。これを実現するために、さまざまなアプローチを試みましたが、成功しませんでした。

何か案は?

前もって感謝します。

4

1 に答える 1

1

setTimeouts は同時に 3500 ミリ秒で終了します。ポイントの順序に基づいて、ポイントのタイムアウトを増やす必要があります... position_on_route *350​​0 のように。

 for (var i in data)
                {
                    var row = data[i];             
                    var latt = row[1];           
                    var lon = row[2]; 
                    timeout=i*3500;
                    moveMarker(map, marker, latt, lon, timeout);
                }




 function moveMarker( map, marker, latt, lon, timeout) {

    setTimeout( function(){ marker.setPosition( new google.maps.LatLng( latt ,       lon  ) ); }, timeout );
    };
于 2013-08-12T19:35:23.410 に答える