2

Google Maps V3の情報ウィンドウを機能させたいので、機能させるのに非常に苦労しています。

-シナリオ:-サンフランシスコの地下鉄システムとGoogleマップの間にマッシュアップを作成しています。1つの機能では、ユーザーがルートを選択すると、マーカー(駅を表す)が地図にオーバーレイされます。マーカーをクリックすると、情報ウィンドウが開き、駅の名前、ルート名(そのルートの色を背景として)、およびその特定の駅での列車の移動のETD時間が表示されるボーダレステーブル(基本的には「特定の目的地に向かう列車が出発するまで数分」)。明らかに、ユーザーがさまざまなマーカーをクリックすると、そのステーションの適切なデータが情報ウィンドウに反映されます。

JSON形式のETDデータを返すサーバー側スクリプトはすべて完全に機能し、希望どおりにデータを受信して​​います。

-問題: -ETDデータを情報ウィンドウに適切に「挿入」できませんでした。適切な表形式で表示したいのですが、何らかの理由で、すべてのETDデータがテーブルに挿入されません。むしろそれはテーブルの外に溢れています。

何か提案や助けをいただければ幸いです。

ありがとう、

-Soumya Roy

コード:-

function drawinfo(mark,abbr,name) {
var infowindow=new google.maps.InfoWindow();
var strContent="<div style=\"width:400px;height:240px;\">
        <div style=\"font-weight:bold;padding:0.5em;\"><p>Station:"+name+"</p></div><br/>
        <div style=\"margin-top:0.3em;background-color:"+Clr+";float:left;font-size:0.8em;
        font-weight:bold;\"><p>Route:"+Rt+"</p></div><div style=\"float:right;\">
        <table style=\"border:0;color:#666;\"><tr><td>Departures</td></tr>"; //Until here the infowindow shows properly.

$.getJSON("getetd.php",{abbr:abbr},function(result) {
    $.each(result,function(key,value) {
        $.each(this,function(k,v) {
            strContent+="<tr><td>|"+k+"</td>";  //The actual JSON data is being received properly.
            $.each(this,function(k2,v2) {
                $.each(this,function(k3,v3) {
                    strContent+="<td>"+v3+"</td>";  //Neither "k" nor "v3" get injected.
                });
            });
            strContent+="</tr>";
        });
    });
}); //getJSON() ends

strContent+="</table></div></div>";
google.maps.event.addListener(mark,'click',function(){
    infowindow.close();  // So as to close any other infowindow.
    infowindow.setContent(strContent);
    infowindow.open(map,mark);
}); //addListener() ends.

} //drawinfo() ends.
4

1 に答える 1

0

JSONフェッチは非同期です。コールバックルーチンで返されたデータを使用する必要があります。現在、クロージング</table></div></div>は​​コールバック関数の外にあります(私は思います)。

データを事前入力するのではなく、クリックリスナーが呼び出されたとき(マーカーがクリックされたとき)にその特定の情報ウィンドウのデータをフェッチすることが必要だと思われるので、クリックリスナーでgetJSON関数を呼び出してから、次のコマンドで情報ウィンドウを開きます。サーバーから戻ったときのデータ(getJSONコールバック)。

于 2012-09-26T19:30:18.233 に答える