Question

我试图使用ajax调用从mysql数据库中获取标记，但标记没有显示。

这是我的connect.php（ajax调用connect.php）

<code>
<?php

$dbname            ='u769748933_tr'; //Name of the database
$dbuser            ='u769748933_ta'; //Username for the db
$dbpass            ='adamas'; //Password for the db
$dbserver          ='mysql.1freehosting.com'; //Name of the mysql server

$dbcnx = mysql_connect ("$dbserver", "$dbuser", "$dbpass");
mysql_select_db("$dbname") or die(mysql_error());
$query = mysql_query("SELECT 'lat','lon' FROM poi_example");
$row = mysql_fetch_array($query);
//Encode the $locations array in JSON format and print it out.
header('Content-Type: application/json');
echo json_encode($row);
?>
</code>

当我运行connect.php时，它返回：

{"0":"lat","lat":"lat","1":"lon","lon":"lon"}

我不知道这是否有效。

这是我的包含ajax调用的javascript文件：

<html>
 <head>
 <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
 <title>Google Map API V3 with markers</title>
 <style type="text/css">
 body { font: normal 10pt Helvetica, Arial; }
 #map { width: 350px; height: 300px; border: 0px; padding: 0px; }
 </style>
 <script src="http://maps.google.com/maps/api/js?v=3&sensor=false" type="text/javascript"></script>
 <script type='text/javascript' src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
  <script type='text/javascript' src='http://code.jquery.com/jquery-ui-1.8.14.custom.min.js'></script>


<script>
function initialize() {
var myLatlng = new google.maps.LatLng(51.514980,-0.144328);
var mapOptions = {
zoom: 14,
center: myLatlng
}
var map = new google.maps.Map(document.getElementById('map'), mapOptions);




    //When the Window finishes loading...
    $(window).load(function () {

        //Carry out an Ajax request.
        $.ajax({
            url: 'connect.php',
            success:function(data){
                //Loop through each location.
                $.each(data, function(){
                    //Plot the location as a marker
                    var pos = new google.maps.LatLng(this.lat, this.lon); 
                    new google.maps.Marker({
                        position: pos,
                        map: map
                    });
                });
            }
        });

    });
}
google.maps.event.addDomListener(window, 'load', initialize);

</script>





<body style="margin:0px; border:0px; padding:0px;">
 <div id="map"></div>
 </body>
 </html>

下面是我的数据库图片： enter image description here

我已经挣扎了2天了！

Answer 1

请执行以下操作：

 $.ajax({
            url: 'connect.php',
            dataType: 'json',
            success:function(data){
            ...

或者说：

success: function(data){
   data = $.parseJSON(data);
...

此外，您的$ .each不正确，请进行以下调整：

$.each(data, function(ind, val){
                    //Plot the location as a marker
                    var pos = new google.maps.LatLng(val.lat, val.lon); 
                    new google.maps.Marker({
                        position: pos,
                        map: map
                    });
                });

此外，您需要按如下方式获取JSON：

{"lat": "-73.899877", "lon" : "59.8765"}

为此，您需要处理PHP代码。

PHP代码更改

$dbname            ='u769748933_tr'; //Name of the database
$dbuser            ='u769748933_ta'; //Username for the db
$dbpass            ='adamas'; //Password for the db
$dbserver          ='mysql.1freehosting.com'; //Name of the mysql server

$dbcnx = mysql_connect ("$dbserver", "$dbuser", "$dbpass");
mysql_select_db("$dbname") or die(mysql_error());
$query = mysql_query("SELECT 'lat','lon' FROM poi_example");
$result = array();
while($row = mysql_fetch_array($query)){
    array_push($result, array(
        'lat' => $row['lat'],
        'lon' => $row['lon']
    ));
}

echo json_encode($result);

Answer 2

在sql中选择字段时，你应该使用反引号 - 不是单引号！另外，虽然没有经过测试，但您可能希望逐行检索记录并将结果分配给最后回显的数组，以供javascript回调使用。

<?php

    $dbname            ='u769748933_tr'; //Name of the database
    $dbuser            ='u769748933_ta'; //Username for the db
    $dbpass            ='adamas'; //Password for the db
    $dbserver          ='mysql.1freehosting.com'; //Name of the mysql server

    $dbcnx = mysql_connect( $dbserver, $dbuser, $dbpass );
    mysql_select_db( $dbname ) or die('unable to connect to database');

    $data=array();
    $query = mysql_query("SELECT `lat`,`lon` FROM `poi_example`");
    if( $query ){

        while( $rs=mysql_fetch_assoc( $query ) ){
            $data[]=array( 'lat'=>$rs['lat'], 'lng'=>$rs['lng'] );
        }

    }

    header('Content-Type: application/json');
    echo json_encode( $data );
?>

无法从ajax调用中检索谷歌地图标记坐标

2 个答案: