1

グーグルマップに関連する小さなプロジェクトをやっているだけです。

基本的に、データベースにajaxを使用して取得したい座標があり、ページを更新せずにマップを更新します。

phpパート：-

$deviceID = $_POST['deviceID'];
$sqlLocation = "SELECT * FROM Location WHERE DeviceID = '".$deviceID."' AND Type ='network'";
$sqlResult = mysql_query($sqlLocation); 

while($row = mysql_fetch_assoc($sqlResult))
{
    $response["uid"] = $row["DeviceID"];
    $response["deviceInfo"]["Longitude"] = $row["Longitude"];
    $response["deviceInfo"]["Latitude"] = $row["Latitude"];
    $response["deviceInfo"]["Type"] = $row["Type"];
    $response["deviceInfo"]["latlontime"] = $row["latlontime"];

    echo json_encode($response);
}

複数のjson結果の形式：-

{"uid":"*deviceID here*","deviceInfo":
   {"Longitude":"x.xxxxxxx","Latitude":"x.xxxxxxx","Type":"network","latlontime":"2012-05-05 18:55:12"}
}

{"uid":"*deviceID here*","deviceInfo":
   {"Longitude":"y.yyyyyyyyy","Latitude":"y.yyyyyyyyy","Type":"network","latlontime":"2012-05-05 18:55:56"}
}

いくつかの擬似コードを含むjavaScript部分申し訳ありません！

    var map;
var count =0;
function initialize(DeviceID) 
  {
    if(DeviceID!=null)
    {
    $.ajax({
                type:"POST",
                dataType:"json",
                data:{deviceID: DeviceID},
                url: "json_coords.php",
                contentType: "application/json; charset=utf-8",
                success: function(data) 
                {
 *****problem used be here******
                    var len = data.length;
                    for( var i = 0; i<len; i++) 
                    {
                            var json_row = data[i];
                            var latitude = json_row.deviceInfo.Latitude;
                            var longitude = json_row.deviceInfo.Longitude;
                            var title = "pos: "+i+json_row.deviceInfo.Type + " " 
                            +json_row.deviceInfo.latlontime ;
                            //alert_test(latitude,student.Longitude);

                            setMarker(latitude,longitude,title);
*********************************************************************************
                    }

                }
            });
    }

    else 
    {
        // do nothing
    }

    var latloncenter = new google.maps.LatLng(51,-1.4469157);
    var myOptions = 
    {
      zoom: 4,
      center: latloncenter,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);



  }


function setMarker(lat,lon,titletxt)
{

var latlongMarker = new google.maps.LatLng(lat,lon);

var marker = new google.maps.Marker
    (
        {
            position: latlongMarker, 
            map: map,
            title:titletxt
        }
    ); 

}

初期化関数は、Webサイトで特定のdivを押した後に呼び出されます：-

$('#leftcolumn>a').click(function() 
    {
    var deviceID = $(this).attr("name");

      //alert(deviceID);
      initialize(deviceID)
    });

あなたが私を助けてくれたら本当にありがたいです

ありがとうございました ：）

*元の問題は、jsonの結果を使用してphpページからデータを取得する方法に関するものでした**

4

2 に答える 2

1

jQueryのAjax関数（JSONモード）は、一意のjsonオブジェクトを予期していました。2を送信すると、形式が無効になります。

できるよ：

$response = array();

while($row = mysql_fetch_assoc($sqlResult))
{
    $response[] = (object) array(
         'uid'        => $row["DeviceID"],
         'deviceInfo' => (object) array  (
               'Longitude'  => $row["Longitude"],
               'Latitude'   => $row["Latitude"],
               'Type'       => $row["Type"],
               'latlontime' => $row["latlontime"]
         )
    );

}

echo json_encode($response);

そして成功したコールバック：

success: function(data) {
     $.each(data, function (device) {
          var title = device.Type + ' ' + device.latlontime;
          setmarker( device.Longitude ,device.Latitude , title);
     });
}
于 2012-05-09T22:42:18.907 に答える
0 
<html>
<head>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&region=GB"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
</head>
<body onload="initialize();">
<div id="map_canvas" style="height:300px;width:500px"></div>
<a href="#" onclick="loaddata(1);">Load markers</a>
<script type="text/javascript">
 var map;
var count =0;
function initialize() 
  {    
    var latloncenter = new google.maps.LatLng(51,-1.4469157);
    var myOptions = 
    {
      zoom: 4,
      center: latloncenter,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  }

function loaddata(DeviceID)
{
if(DeviceID!=null)
    {
    $.ajax({
              type: "POST",
              dataType: "json",
              data:{deviceID: DeviceID },
              url: 'mapdata.php',
       success: function(data) 
       {       
           $.each(data,function(index,value) {
             console.log(value);
              /// I know there is no such thing as data.jsonGetvalueByID just trying to explain what I want to do 
             var longitude = value.deviceInfo.Longitude;
             var latitude = value.deviceInfo.Latitude;
             var type = value.deviceInfo.Type;
             var time = value.deviceInfo.latlontime;
             var title = type + " " +time;
             //calling function to add map marker
             createmarker(longitude, latitude, title);          
            });


       }
    }); 
    }

}

function createmarker(lat,lon,titletxt)
{
var latlongMarker = new google.maps.LatLng(lat,lon);

var marker = new google.maps.Marker
    (
        {
            position: latlongMarker, 
            map: map,
            title:titletxt
        }
    ); 

    return marker;
}
</script>
</body>
</html>
// my ajax file that just fakes the data needed, so replace with your database code.
<?php
$response = array();
$rows = array();
$rows[] = array("DeviceID"=>1,"Type"=>"Network","Longitude"=>"51.4343","Latitude"=>"-2.344","latlontime"=>date("Y-m-d H:i:s"));
$rows[] = array("DeviceID"=>2,"Type"=>"Network","Longitude"=>"55.4343","Latitude"=>"-2.644","latlontime"=>date("Y-m-d H:i:s"));
foreach ($rows as $row)
{
$data["uid"] = $row["DeviceID"];
    $data["deviceInfo"]["Longitude"] = $row["Longitude"];
    $data["deviceInfo"]["Latitude"] = $row["Latitude"];
    $data["deviceInfo"]["Type"] = $row["Type"];
    $data["deviceInfo"]["latlontime"] = $row["latlontime"];

    $response[] = $data;
}

echo json_encode($response);

?>
于 2012-05-09T23:01:12.423 に答える