2012-05-19 33 views
2

我在mysql數據庫的數據,我希望能夠讀取PHP數組數據,並將其用於谷歌的地理定位。如何從MySQL返回PHP數組到谷歌地理位置

因此,對於這個例子,我想只用SELECT *聲明,因爲我不會用一些參數打擾你......

我想實現的是獲得標誌着從A點到B線(取決於在哪裏保存GPS位置)

這是我想要在我的地圖上的鏈接:POLYLINE在這個例子中,我只想要更多的數組中有4個數據。

所以,現在我們可以回到代碼。這是我連接到mysql的PHP腳本。我一直在使用mysqli,因爲我以後會在數據庫中存儲過程,所以不要混淆。

class dbMySql 
{ 
static function Exec($query) { 
// open database 
$conn = mysqli_connect(
$GLOBALS['cfg_db_Server'], 
$GLOBALS['cfg_db_User'], 
$GLOBALS['cfg_db_Pass'] 
); 
if($conn === false) 
{ 
    throw new Exception(mysqli_connect_error()); 
} 
mysqli_select_db($conn,$GLOBALS['cfg_db_Name']); 
$result = mysqli_query($conn,$query); 
if(is_bool($result) && !$result) 
{ 
    $error = mysqli_error($conn); 
    mysqli_close($conn); 
    throw new Exception($error); 
} 
mysqli_close($conn); 
return $result; 
} 
} 

如何連接這個PHP腳本代碼,例如谷歌API頁面上,當按鈕被點擊,而不是固定的人插入我的陣列值:

<!DOCTYPE html> 
<html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <script type="text/javascript" 
     src="http://maps.googleapis.com/maps/api/js?key=KEY&sensor=true"> 
    </script> 
    <script type="text/javascript"> 
    function initialize() { 
    var myLatLng = new google.maps.LatLng(0, -180); 
    var myOptions = { 
    zoom: 3, 
    center: myLatLng, 
    mapTypeId: google.maps.MapTypeId.TERRAIN 
    }; 

    var map = new google.maps.Map(document.getElementById("map_canvas"), 
     myOptions); 
    var flightPlanCoordinates = [ 
    new google.maps.LatLng(37.772323, -122.214897), 
    new google.maps.LatLng(21.291982, -157.821856), 
    new google.maps.LatLng(-18.142599, 178.431), 
    new google.maps.LatLng(-27.46758, 153.027892) 
    ]; 
    var flightPath = new google.maps.Polyline({ 
    path: flightPlanCoordinates, 
    strokeColor: "#FF0000", 
    strokeOpacity: 1.0, 
    strokeWeight: 2 
    }); 

    flightPath.setMap(map); 
} 
    </script> 
    </head> 
    <body onload="initialize()"> 
    <div id="map_canvas" style="width:100%; height:80%"></div> 
    <div><button type="button">Click Me!</button></div> 
    </body> 
</html> 

編輯:

這是我所得到的,當我做你的代碼: error

EDIT2:

<!DOCTYPE html> 
<html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <style type="text/css"> 
     html { height: 100% } 
     body { height: 100%; margin: 0; padding: 0 } 
     #map_canvas { height: 100% } 
    </style> 
    <script type="text/javascript" 
     src="http://maps.googleapis.com/maps/api/js?key=key&sensor=true"> 
    </script> 
    <script type="text/javascript"> 
    function initialize() { 
    var myLatLng = new google.maps.LatLng(0, 180); 
    var myOptions = { 
    zoom: 3, 
    center: myLatLng, 
    mapTypeId: google.maps.MapTypeId.TERRAIN 
    }; 

    var map = new google.maps.Map(document.getElementById("map_canvas"), 
     myOptions); 
    var flightPlanCoordinates = [ <?php echo implode(',', $coordinates) ?> ]; 
    ]; 
    var flightPath = new google.maps.Polyline({ 
    path: flightPlanCoordinates, 
    strokeColor: "#FF0000", 
    strokeOpacity: 1.0, 
    strokeWeight: 2 
    }); 

    flightPath.setMap(map); 
} 
</script> 
</script> 
    <?PHP 
class dbMySql { 

    static function Exec($query) { 
     // open database 
     $conn = mysqli_connect('localhost','root','*****'); 
     if($conn === false) { 
      throw new Exception(mysqli_connect_error()); 
    } 
     mysqli_select_db($conn,'data_gps'); 

    $result = mysqli_query($conn,$query); 

     if(is_bool($result) && !$result) { 
      $error = mysqli_error($conn); 
      mysqli_close($conn); 
      throw new Exception($error); 
     } 

     mysqli_close($conn); 

    return $result; 
    } 
} 
$coordinates = array(); 
$result = dbMySql::Exec('SELECT lat,lng FROM data'); 
while ($row = mysqli_fetch_assoc($result)) 
    $coordinates[] = 'new google.maps.LatLng(' . $row['lat'] . ', ' . $row['lng'] . ')' ; 
?> 
    </script> 
    </head> 
    <body onload="initialize()"> 
    <div id="map_canvas" style="width:100%; height:80%"></div> 
    <div><button type="button">Click Me!</button></div> 
    </body> 
</html> 

回答

2

即時猜測你所需要的結果之間進行迭代,然後將它們呼應成的JavaScript。

林假設你有存儲在數據庫中的緯度和經度。

$coordinates = array(); 
$result = dbMySql::Exec('SELECT lat, lng FROM table WHERE id = 1'); 
while ($row = mysqli_fetch_assoc($result)) 
    $coordinates[] = 'new google.maps.LatLng(' . $row['lat'] . ', ' . $row['lng'] . ')'; 

,然後在你的JavaScript部分

var flightPlanCoordinates = [ <?php echo implode(',', $coordinates) ?> ]; 

編輯:

<!DOCTYPE html> 
<?PHP 
class dbMySql { 

    static function Exec($query) { 
     // open database 
     $conn = mysqli_connect('localhost','root','*****'); 
     if($conn === false) { 
      throw new Exception(mysqli_connect_error()); 
    } 
     mysqli_select_db($conn,'data_gps'); 

    $result = mysqli_query($conn,$query); 

     if(is_bool($result) && !$result) { 
      $error = mysqli_error($conn); 
      mysqli_close($conn); 
      throw new Exception($error); 
     } 

     //mysqli_close($conn); 

    return $result; 
    } 
} 
$coordinates = array(); 
$result = dbMySql::Exec('SELECT lat,lng FROM data'); 
while ($row = mysqli_fetch_assoc($result)) 
    $coordinates[] = 'new google.maps.LatLng(' . $row['lat'] . ', ' . $row['lng'] . ')'; 
?> 
<html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <style type="text/css"> 
     html { height: 100% } 
     body { height: 100%; margin: 0; padding: 0 } 
     #map_canvas { height: 100% } 
    </style> 
    <script type="text/javascript" 
     src="http://maps.googleapis.com/maps/api/js?key=key&sensor=true"> 
    </script> 
    <script type="text/javascript"> 
    function initialize() { 
    var myLatLng = new google.maps.LatLng(0, 180); 
    var myOptions = { 
    zoom: 3, 
    center: myLatLng, 
    mapTypeId: google.maps.MapTypeId.TERRAIN 
    }; 

    var map = new google.maps.Map(document.getElementById("map_canvas"), 
     myOptions); 
    var flightPlanCoordinates = [<?php echo implode(',', $coordinates) ?>]; 
    var flightPath = new google.maps.Polyline({ 
    path: flightPlanCoordinates, 
    strokeColor: "#FF0000", 
    strokeOpacity: 1.0, 
    strokeWeight: 2 
    }); 

    flightPath.setMap(map); 
} 
</script> 
    </head> 
    <body onload="initialize()"> 
    <div id="map_canvas" style="width:100%; height:80%"></div> 
    <div><button type="button">Click Me!</button></div> 
    </body> 
</html> 
+0

嗨,我已經試過你的代碼。當我執行回波座標時,我確實得到了經度和緯度的結果。但是當我把它放在我的代碼中時,它不起作用。地圖不加載,我已經把腳本內的PHP –

+0

我已經把錯誤的圖片上面 –

+0

您的文件以'.php'結尾嗎? – mpratt