GoogleMapsのツールを作る (8)
Posted on September 30th, 2008
前回作った表のデータの未入力箇所を置換えます。置換えるタイミングはラインのデータを生成するのと同じで、関数 add_lineの中で行います。
置き換わるデータの元となる変数を関数の外に配置します。なおこのソースは表示上不必要な改行コードを含んでいます。
var marker_position_list_data = "<tr><th>no.</th><th>lat</th><th>long</th>
<th>linear</th><th>road</th></tr>";
var mp_lat;
var mp_lng;
var linear_distance = 0;
var road_distance = 0;
var start_point;
var measure_point;
関数 add_lineの if(polyline)が真のときの処理の中に下記コードを追加します。変数 marker_position_list_dataのデータを初期化します。なおこのソースは表示上不必要な改行コードを含んでいます。
marker_position_list_data = "<tr><th>no.</th><th>lat</th><th>long</th>
<th>linear</th><th>road</th></tr>";
関数 add_lineの forの繰り返し処理の中に下記コードを追加します。マーカーの数だけ位置情報を表示用に分割します。
mp_lat = marker_posi.lat();
mp_lng = marker_posi.lng();
関数 add_lineの forの繰り返し処理の中に下記コードを追加します。最初のマーカーか否かを判断する分岐をもうけ最初のマーカーだったときの処理を記述します。
if(i==0){
linear_distance = 0;
road_distance = 0;
最初のマーカーでないときの処理を記述します。スタート位置を指定します。（上記に続けて記述）
}else{
start_point = marker_point[0].getPoint();
直線距離を計測します。（上記に続けて記述）
linear_distance = Math.floor(start_point.distanceFrom(marker_posi));
１つ前のマーカー位置情報を取得します。（上記に続けて記述）
var num = i-1;
measure_point = marker_point[num].getPoint();
みちのりを計測します。（上記に続けて記述）
road_distance += Math.floor(measure_point.distanceFrom(marker_posi));
}
表の内容と置き換わるデータを生成します。（上記に続けて記述）
marker_position_list_data += "<tr><td>" + i + "</td><td>" + mp_lat + "</td><td>" + mp_lng + "</td><td>" + linear_distance + " m</td><td>" + road_distance + " m</td></tr>";
関数 add_lineの中に下記コードを追加します。この関数を呼出した元々の PHPファイルの IDにlist-dataがあたえられた要素とおきかえます。
document.getElementById("list-data").innerHTML = marker_position_list_data;
