前回ご紹介した「GPS地図自動作成ツール」は、GPSログが2本以上に分かれている場合でも、1本の軌跡として表示します。
トンネルなど衛星の電波が届かず軌跡が切れている場合は、1本に繋がった方が好都合の場合もありますが、今回、清水北山好会のホームページにアップした「乗鞍高原にレンゲツツジ 」のルート図のように1日に数か所をウォーキングした場合などは、1本につなげて表示すると適切でない場合もあります。またトンネルなどで切れた場合も、切れているように表示した方がいいという考え方もあります。
そこで、今回は切れているGPSログは切れているように表示するよう改修しました。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&v=3&language=ja&libraries=geometry"></script>
<script type="text/javascript" src="jquery.min.js"></script>
<title>gps2map作成ツール Ver.15.06.22</title>
<HTA:APPLICATION BORDER="dialog">
<script language="VBScript">
'変数宣言
Dim fomData() 'fomデータ
Dim jpgData(30,7), pppppppPath(10) '画像データ読み込む配列, エンコード化されたパスの配列
Dim fomlen
Dim gpxPath1, gpxPath2, camOffset, offsetT
Dim walkTime, walkSecond, pppStr
Dim maxN : maxN = 0 '最大緯度初期値
Dim minN : minN = 90 '最少緯度初期値
Dim maxE : maxE = 0 '最大経度初期値
Dim minE : minE = 180 '最少経度初期値
'配列のメモ
'jpgData(i,j) i=0～29 マーカー画像
' j:0=jpgFullPath 1=ファイル名 2=撮影Time 3=lat lon 4=ele 5=coment 6=Time(JST) 7=DiffTime
Set objFso = CreateObject("Scripting.FileSystemObject") '準備 ファイルシステムオブジェクトのセット
Set objFile = objFso.GetFile("gps2map.hta") 'C:\Users\Owner\Documents\tool\gps2map.hta
toolPath = objFile.ParentFolder 'C:\Users\Owner\Documents\map\tool
mapPath = Replace(toolPath, "\tool", "") 'C:\Users\Owner\Documents\map
Sub Window_OnLoad
Call Window.ResizeTo(1200,800)
End Sub
'-------------------------------------------------
'メインルーチン 実行 ボタン
'-------------------------------------------------
Sub okClick()
fomlen = Document.forms("fom").Length - 1
ReDim fomData(fomlen) 'fomData配列の大きさ宣言
For i=0 To fomlen
Select Case i
Case 2,6
fomData(i) = Document.forms("fom").item(i).checked
Case Else
fomData(i) = Document.forms("fom").item(i).Value
End Select
Next
gpxPath1 = fomData(0) 'GPXファイルPath（C:\Users\Owner\Desktop\new.gpx）
gpxPath2 = "file:///" & Replace(gpxPath1, "\", "/") 'GPXファイルPath（file:///C:/Users/Owner/Desktop/new.gpx）
offsethh = fomData(3) 'オフセット時
offsetmm = fomData(4) 'オフセット分
offsetss = fomData(5) 'オフセット秒
For Each i In document.getElementsByName("offset")
If i.checked Then
camOffset = i.value 'カメラオフセット
Exit For
End If
Next
offsetT = (offsethh)*3600 + (offsetmm)*60 + (offsetss)
If camOffset = "o1" Then
offsetT = (-1) * offsetT
End If
For i=0 To 29
jpgData(i,0) = fomData(i*2+7) '画像ファイルネーム
If jpgData(i,0) <> "" Then
jpgData(i,1) = objFso.GetFileName(jpgData(i,0))
jpgData(i,1) = LCase(Replace(jpgData(i,1), " ", "-")) '画像ファイルネーム
jpgData(i,5) = fomData(i*2+8) '画像コメント
jpgData(i,2) = funcExifTimeGet(jpgData(i,0), OffsetT) '撮影時刻
jpgData(i,7) = 100000000 'GPS時刻と撮影時刻との時間差の初期値（充分大きな値）
End If
Next
Call subJpgResize() '画像リサイズ
Call createEncodedPolyline() 'エンコードポリライン作成
Call subMarkerCreate() 'marker.xml 作成
Call subHtmlCreate() 'gmap.html 作成
MsgBox("完了！")
Window.Close()
End Sub
'-------------------------------------------------
'サムネイル表示
'-------------------------------------------------
Sub fnameCopy(num)
Document.getElementById("thumb" & num).innerHTML = "<img id=""pic"" src=""" & Document.forms("fom").item(num*2+7).Value & """ width=""108"">" 'サムネイルにコピー
Document.getElementById("imgName" & num).innerHTML = num+1 'ツールに表示するサムネイル用画像番号
End Sub
'----------------------------------------------------------------
'htmlファイル生成 gmap.html
'----------------------------------------------------------------
Sub subHtmlCreate()
motoFile = toolPath & "\gmap.html" 'テンプレート
shinFile = mapPath & "\gmap.html" '出力ファイル
With CreateObject("ADODB.Stream")
.Charset = "UTF-8" '文字コードはUTF-8
.Open
.LoadFromFile(motoFile)
txOut = .ReadText 'テンプレートを全行読み込む
.Close
End With
txOut = Replace(txOut, "hhhmmm", walkTime) '所要時間
txOut = Replace(txOut, "minlat", minN) 'minlatをポリラインの範囲の南西の角の緯度で書き換える
txOut = Replace(txOut, "minlng", minE) 'minlngをポリラインの範囲の南西の角の経度で書き換える
txOut = Replace(txOut, "maxlat", maxN) 'maxlatをポリラインの範囲の北東の角の緯度で書き換える
txOut = Replace(txOut, "maxlng", maxE) 'maxlngをポリラインの範囲の北東の角の経度で書き換える
Str = ""
For i=0 To 9
If pppppppPath(i) = "" Then Exit For
Str = Str & vbTab & "encodedPath[" & i & "] = """ & pppppppPath(i) & """" & vbCrLf
Next
txOut = Replace(txOut, "pppppppppp", Str) 'pppppppppをエンコードポリラインで書き換える
Call WriteUTF8(txOut, shinFile) '文字コードUTF-8でファイルを出力する
End Sub
'-------------------------------------------------
'マーカー・ファイル生成 marker.xml
'-------------------------------------------------
Sub subMarkerCreate()
shinFile = mapPath & "\marker.xml" 'xmlファイル
Str0 = "<?xml version=""1.0"" encoding=""UTF-8"" ?>" & vbCrLf & vbCrLf & _
"<points>" & vbCrLf
txOut = ""
txOut = txOut & Str0
For j=0 To 29
If jpgData(j,1) <> "" Then
myDate = DateAdd("s", 30, jpgData(j,2))
myTime = DatePart("h", myDate) & ":" & Right("0" & DatePart("n", myDate), 2)
txOut = txOut & String(1, vbTab) & "<point>" & vbCrLf
txOut = txOut & String(2, vbTab) & "<lat>" & Replace(jpgData(j,3), " ", "</lat><lng>") & "</lng>" & vbCrLf
txOut = txOut & String(2, vbTab) & "<title>" & myTime & " GPS標高=" & Round(jpgData(j,4), 0) & "m</title>" & vbCrLf
txOut = txOut & String(2, vbTab) & "<description>" & jpgData(j,5) & "</description>" & vbCrLf
txOut = txOut & String(2, vbTab) & "<image>" & jpgData(j,1) & "</image>" & vbCrLf
txOut = txOut & String(1, vbTab) & "</point>" & vbCrLf
End If
Next
txOut = txOut & "</points>" & vbCrLf
Call WriteUTF8(txOut, shinFile) '文字コードUTF-8でファイルを出力する
End Sub
'--------------------------------------------
'function funcExifTimeGet Exifタイム取得
'--------------------------------------------
Function funcExifTimeGet(Filname, Offset)
Dim jpgFil, i, j, binDate(9), binTime(7), binData(19)
Dim byt, jpgTimeStr
set jpgFil = CreateObject("ADODB.Stream")
jpgFil.Open
jpgFil.Type = 1
jpgFil.LoadFromFile(Filname)
Flag = 0
i = 0
Do
i = i + 1
byt = jpgFil.Read(1)
Select Case i
Case 1,2,3,4,6,7,9,10,12,13,15,16,18,19
If AscB(midb(byt,1))=>48 And AscB(midb(byt,1))=<57 Then
binData(i) = Chr(AscB(midb(byt,1)))
Else
i = 0
End If
Case 5,8,14,17
If Chr(AscB(midb(byt,1)))=":" Then
binData(i) = Chr(AscB(midb(byt,1)))
Else
i = 0
End If
Case 11
If Chr(AscB(midb(byt,1)))=" " Then
binData(i) = Chr(AscB(midb(byt,1)))
Else
i = 0
End If
End Select
If Flag=0 And i=19 Then
i = 0
Flag = 1
ElseIf Flag=1 And i=19 Then
Exit Do
End If
Loop
jpgFil.Close
jpgDateStr = ""
For i=1 To 19
If i<10 And binData(i) = ":" Then
binData(i) = "/"
End If
jpgDateStr = jpgDateStr & binData(i)
Next
jpgDate = DateAdd("s", Offset, CDate(jpgDateStr))
funcExifTimeGet = CStr(jpgDate)
End Function
'--------------------------------------------
'JPEG画像リサイズ xxxxxx.jpg
'--------------------------------------------
Sub subJpgResize()
Set WshShell = CreateObject("WScript.Shell")
exeFile = toolPath & "\photoshifter.exe"
setFile = toolPath & "\mysetting.xml"
outPath = mapPath & "\"
For i=0 To 29
If jpgData(i,0) <> "" Then
copyFileStr = exeFile & " /overwrite /par " & setFile & " /format JPEG /file " & """" & jpgData(i,0) & """ " & outPath & jpgData(i,1)
Call WshShell.Run (copyFileStr,,True)
End If
Next
Set WshShell = Nothing
End Sub
'--------------------------------------------
'UTF8で書込む
'--------------------------------------------
Sub WriteUTF8(text, fileName)
tmpFile = fileName & ".tmp"
' UTF-8で書きこむと自動的にBOM(Byte Order Mark)が、先頭に3バイト付加されてしまう。
' それを回避するため、一旦一時ファイルにUTF-8形式で書き込む
With CreateObject("ADODB.Stream")
.Type = 2
.charset = "UTF-8"
.Open
.WriteText text
.SaveToFile tmpFile, 2
.Close
End With
With CreateObject("ADODB.Stream") '一時ファイルをバイナリで読み取る
.Type = 1
.Open
.LoadFromFile(tmpFile) '一時ファイルをバイナリで読み取る
.Position = 3 'BOMの3バイトをスキップして、次行以降でバイナリで書き込む
Dim ws : Set ws = CreateObject("ADODB.Stream")
ws.Type = 1
ws.Open
ws.Write(.Read(-1))
ws.SaveToFile fileName, 2
ws.Close
.Close
End With
Call CreateObject("Scripting.FileSystemObject").DeleteFile(tmpFile) '一時ファイルの削除
End Sub
</script>
<script language="Javascript">
//--------------------------------------------
//EncodedPolyline作成
//--------------------------------------------
function createEncodedPolyline(){
var dateStr, timeStr, jst, jpgTime, gpsTime, sTime, eTime;
var encodedPath = [];
for (var j = 0; j < 29; j++) {
if (jpgData(j,0) != "") {
dateStr = gpsDate2dateStr(jpgData(j,2));
timeStr = gpsTime2timeStr(jpgData(j,2));
jst = dateTimeStr2dateJST(dateStr,timeStr);
jpgData(j,6) = jst;
}
}
//GPXのデータを取得する
$.get(gpxPath2, function(xml){
var seg = $("trkseg", xml);
for (n = 0; n < seg.length; n++) {
var gpx = $("trkpt", seg[n]);
//取得したデータから緯度経度を取得、配列に格納
var trkpt, lat, lng, i, j, latLng, ele, utc, diffTime;
var buff = [];
for (i = 0; i < gpx.length; i++) {
lat = $(gpx[i]).attr("lat"); //<trkpt lat="yyy" lng="xxx">からyyy,xxxを切り出す
lng = $(gpx[i]).attr("lon");
ele = $(gpx[i]).find("ele").text();
utc = $(gpx[i]).find("time").text();
utc = utc.replace(/-/g, "/");
dateStr = gpsDate2dateStr(utc);
timeStr = gpsTime2timeStr(utc);
jst = dateTimeStr2dateJST(dateStr,timeStr);
gpsTime = jst.getTime() + 32400000; //日本標準時にするため9時間プラス（ミリ秒）
for (j = 0; j < 30; j++) {
if (jpgData(j,0) != "") {
diffTime = Math.abs(gpsTime - jpgData(j,6));
if (jpgData(j,7) > diffTime) {
jpgData(j,7) = diffTime;
jpgData(j,3) = lat + " " + lng;
jpgData(j,4) = ele;
}
}
}
//GPS軌跡の範囲を取得（南西の角から北東の角の緯度経度取得）
lat = +lat; //文字列を数値に変換
lng = +lng; //文字列を数値に変換
maxE = (maxE < lng) ? lng : maxE;
minE = (minE > lng) ? lng : minE;
maxN = (maxN < lat) ? lat : maxN;
minN = (minN > lat) ? lat : minN;
if (n == 0 & i == 10) {
sTime = gpsTime / 1000; //Start時間（最初はデータが荒れている場合が多いため10ポイントは準備中として捨てる）
}
if (n == seg.length-1 & i == gpx.length - 2){
eTime = gpsTime / 1000; //End時間（最後の1ポイントは捨てる）
}
//latLngを作成
buff.push( new google.maps.LatLng(lat, lng) );
}
encodedPath[n] = google.maps.geometry.encoding.encodePath(buff);
pppppppPath(n) = encodedPath[n].replace(/\\/g, "\\\\");
}
});
walkSecond = eTime - sTime; //行動時間（End時間 - Start時間）
}
// 日付形式を書き換える DDMMYY形式 (例)2014年11月20日 or 2014-11-20 → [dateStr] "2014/11/20"
function gpsDate2dateStr(s){
var yy = s.substr(0,4);
var mm = s.substr(5,2);
var dd = s.substr(8,2);
return (yy + '/' + mm + '/' + dd);
}
// 時刻形式を書き換える hhmmss形式 (例)8:55:30 → [timeStr] " 8:55:30"
function gpsTime2timeStr(s){
var pos = s.indexOf(":");
var hh = s.substr(pos-2, 2);
var mm = s.substr(pos+1, 2);
var ss = s.substr(pos+4, 2);
return (hh + ':' + mm + ':' + ss);
}
function dateTimeStr2dateJST(dateStr,timeStr){
var d = new Date(dateStr + ' ' + timeStr);
return d;
}
</script>
<style type="text/css">
body { font-size: 16px;}
#offsetTable{ margin-top:0; margin-left:100px;}
#imgTable { margin-top:0; margin-left:15px;}
.small { font-size:12px;}
.largest { font-size:30px; font-weight:bold;}
</style>
</head>
<body style="background-color:#eff8ef;">
<h2>ホームページ用のGPSポリラインを作成します</h2>
<h3>■ 使い方</h3>
<ol>
<li>撮影ポイントに表示するデジカメ画像を準備してください。（縮小した画像は撮影時刻のExif情報が失われている場合があります。オリジナル画像をお使いください。リサイズは自動で行います）</li>
<li>GPSデータはカシミールなどで［GPX］形式（new.gpxなど）で書き出しておいてください。</li>
</ol>
<p> </p>
<form id="fom">
<h3>■ GPXファイル <span class="small">GPS軌跡を作成する GPXファイル を指定してください。</span></h3>
<p> <input type="file" size="70" name="imp_file" /> <span class="small">カシミールなどでGPX形式（new.gpx）で書き出したファイルを指定します。</span></p>
<p> <input id="Ok" name="Ok" type="button" value="［作 成］" onclick="okClick()" class="largest" /></p>
<h3>■ 撮影ポイントに表示する画像</h3>
<div id="offsetTable">
<table border="0">
<tbody>
<tr>
<td rowspan="2" width="180">カメラ内蔵時計補正値</td>
<td><input type="radio" name="offset" value="o1" checked /><b>＋</b></td>
<td rowspan="2"><input size="3" type="text" name="hh" value="00" /></td>
<td rowspan="2"><font size="-1">時</font></td>
<td rowspan="2"><input size="3" type="text" name="mm" value="00" /></td>
<td rowspan="2"><font size="-1">分</font></td>
<td rowspan="2"><input size="3" type="text" name="ss" value="00" /></td>
<td rowspan="2"><font size="-1">秒</font></td>
<td rowspan="2" width="300" align="center"><span class="small"> GPSに対してカメラが 進み＝（＋） 遅れ＝（－）</span></td>
</tr>
<tr>
<td><input type="radio" name="offset" value="o2" /><b>－</b></td>
</tr>
</tbody>
</table>
</div>
<br>
<div id="imgTable">
<table border="0">
<tbody>
<tr><td width="108"><div id="thumb0"></div></td><td width="108"><div id="thumb1"></div></td><td width="108"><div id="thumb2"></div></td><td width="108"><div id="thumb3"></div></td><td width="108"><div id="thumb4"></div></td><td width="108"><div id="thumb5"></div></td><td width="108"><div id="thumb6"></div></td><td width="108"><div id="thumb7"></div></td><td width="108"><div id="thumb8"></div></td><td width="108"><div id="thumb9"></div></td></tr>
<tr><td align="center"><div id="imgName0"></div></td><td align="center"><div id="imgName1"></div></td><td align="center"><div id="imgName2"></div></td><td align="center"><div id="imgName3"></div></td><td align="center"><div id="imgName4"></div></td><td align="center"><div id="imgName5"></div></td><td align="center"><div id="imgName6"></div></td><td align="center"><div id="imgName7"></div></td><td align="center"><div id="imgName8"></div></td><td align="center"><div id="imgName9"></div></td></tr>
<tr><td width="108"><div id="thumb10"></div></td><td width="108"><div id="thumb11"></div></td><td width="108"><div id="thumb12"></div></td> <td width="108"><div id="thumb13"></div></td><td width="108"><div id="thumb14"></div></td><td width="108"><div id="thumb15"></div></td><td width="108"><div id="thumb16"></div></td><td width="108"><div id="thumb17"></div></td><td width="108"><div id="thumb18"></div></td><td width="108"><div id="thumb19"></div></td></tr>
<tr><td align="center"><div id="imgName10"></div></td><td align="center"><div id="imgName11"></div></td><td align="center"><div id="imgName12"></div></td><td align="center"><div id="imgName13"></div></td><td align="center"><div id="imgName14"></div></td><td align="center"><div id="imgName15"></div></td><td align="center"><div id="imgName16"></div></td><td align="center"><div id="imgName17"></div></td><td align="center"><div id="imgName18"></div></td><td align="center"><div id="imgName19"></div></td></tr>
<tr><td width="108"><div id="thumb20"></div></td><td width="108"><div id="thumb21"></div></td><td width="108"><div id="thumb22"></div></td> <td width="108"><div id="thumb23"></div></td><td width="108"><div id="thumb24"></div></td><td width="108"><div id="thumb25"></div></td><td width="108"><div id="thumb26"></div></td><td width="108"><div id="thumb27"></div></td><td width="108"><div id="thumb28"></div></td><td width="108"><div id="thumb29"></div></td></tr>
<tr><td align="center"><div id="imgName20"></div></td><td align="center"><div id="imgName21"></div></td><td align="center"><div id="imgName22"></div></td><td align="center"><div id="imgName23"></div></td><td align="center"><div id="imgName24"></div></td><td align="center"><div id="imgName25"></div></td><td align="center"><div id="imgName26"></div></td><td align="center"><div id="imgName27"></div></td><td align="center"><div id="imgName28"></div></td><td align="center"><div id="imgName29"></div></td></tr>
</tbody>
</table>
</div>
<div nowrap> <span class="small">［ファイル名］ ［画像タイトル］9文字まで ［画像コメント］1列：19文字まで</span><br />
1<input id="jpg1" name="jpeg1" type="file" onchange="fnamecopy(0)" size="50" /> <input size="70" type="text" name="coment1" /><br />
2<input id="jpg2" name="jpeg2" type="file" onchange="fnameCopy(1)" size="50" /> <input size="70" type="text" name="coment2" /><br />
3<input id="jpg3" name="jpeg3" type="file" onchange="fnameCopy(2)" size="50" /> <input size="70" type="text" name="coment3" /><br />
4<input id="jpg4" name="jpeg4" type="file" onchange="fnameCopy(3)" size="50" /> <input size="70" type="text" name="coment4" /><br />
5<input id="jpg5" name="jpeg5" type="file" onchange="fnameCopy(4)" size="50" /> <input size="70" type="text" name="coment5" /><br />
6<input id="jpg6" name="jpeg6" type="file" onchange="fnameCopy(5)" size="50" /> <input size="70" type="text" name="coment6" /><br />
7<input id="jpg7" name="jpeg7" type="file" onchange="fnameCopy(6)" size="50" /> <input size="70" type="text" name="coment7" /><br />
8<input id="jpg8" name="jpeg8" type="file" onchange="fnameCopy(7)" size="50" /> <input size="70" type="text" name="coment8" /><br />
9<input id="jpg9" name="jpeg9" type="file" onchange="fnameCopy(8)" size="50" /> <input size="70" type="text" name="coment9" /><br />
10<input id="jpg10" name="jpeg10" type="file" onchange="fnameCopy(9)" size="50" /> <input size="70" type="text" name="coment10" /><br />
11<input id="jpg11" name="jpeg11" type="file" onchange="fnameCopy(10)" size="50" /> <input size="70" type="text" name="coment11" /><br />
12<input id="jpg12" name="jpeg12" type="file" onchange="fnameCopy(11)" size="50" /> <input size="70" type="text" name="coment12" /><br />
13<input id="jpg13" name="jpeg13" type="file" onchange="fnameCopy(12)" size="50" /> <input size="70" type="text" name="coment13" /><br />
14<input id="jpg14" name="jpeg14" type="file" onchange="fnameCopy(13)" size="50" /> <input size="70" type="text" name="coment14" /><br />
15<input id="jpg15" name="jpeg15" type="file" onchange="fnameCopy(14)" size="50" /> <input size="70" type="text" name="coment15" /><br />
16<input id="jpg16" name="jpeg16" type="file" onchange="fnameCopy(15)" size="50" /> <input size="70" type="text" name="coment16" /><br />
17<input id="jpg17" name="jpeg17" type="file" onchange="fnameCopy(16)" size="50" /> <input size="70" type="text" name="coment17" /><br />
18<input id="jpg18" name="jpeg18" type="file" onchange="fnameCopy(17)" size="50" /> <input size="70" type="text" name="coment18" /><br />
19<input id="jpg19" name="jpeg19" type="file" onchange="fnameCopy(18)" size="50" /> <input size="70" type="text" name="coment19" /><br />
20<input id="jpg20" name="jpeg20" type="file" onchange="fnameCopy(19)" size="50" /> <input size="70" type="text" name="coment20" /><br />
21<input id="jpg21" name="jpeg21" type="file" onchange="fnameCopy(20)" size="50" /> <input size="70" type="text" name="coment21" /><br />
22<input id="jpg22" name="jpeg22" type="file" onchange="fnameCopy(21)" size="50" /> <input size="70" type="text" name="coment22" /><br />
23<input id="jpg23" name="jpeg23" type="file" onchange="fnameCopy(22)" size="50" /> <input size="70" type="text" name="coment23" /><br />
24<input id="jpg24" name="jpeg24" type="file" onchange="fnameCopy(23)" size="50" /> <input size="70" type="text" name="coment24" /><br />
25<input id="jpg25" name="jpeg25" type="file" onchange="fnameCopy(24)" size="50" /> <input size="70" type="text" name="coment25" /><br />
26<input id="jpg26" name="jpeg26" type="file" onchange="fnameCopy(25)" size="50" /> <input size="70" type="text" name="coment26" /><br />
27<input id="jpg27" name="jpeg27" type="file" onchange="fnameCopy(26)" size="50" /> <input size="70" type="text" name="coment27" /><br />
28<input id="jpg28" name="jpeg28" type="file" onchange="fnameCopy(27)" size="50" /> <input size="70" type="text" name="coment28" /><br />
29<input id="jpg29" name="jpeg29" type="file" onchange="fnameCopy(28)" size="50" /> <input size="70" type="text" name="coment29" /><br />
30<input id="jpg30" name="jpeg30" type="file" onchange="fnameCopy(29)" size="50" /> <input size="70" type="text" name="coment30" /><br />
</div>
</form>
</body>
</html>GPSログは［trkseg］に囲まれた部分が１本の軌跡です。
ログが切れている場合は、これが複数あるので［trkseg］毎に For ループで回せば良いことになります。303行目から355行目までが、その For ループです。その結果、エンコードポリライン（encodedPath）が n 個生成されます。
なお表示範囲はラインが１本に繋がっていても複数個に分割されても関係ないので、GPSログの緯度/経度の最大値と最小値を得ることには変わりはありません。
上記のツールは、ひな形［gmap.html］の［pppppppppp］の文字列をツールが作成した64進エンコードパスで書き換える方式を取っています。従って、元になるひな形が必要です。
右のリンクをクリックして「ひな形」をコピーしてください。（http://gpswalking.jp/diary/20150625/gmap2.html ）
何も表示しない白紙に見えるページです。これをコピーします。各ブラウザでのやり方は
- Internet Explorer の場合 ： ［表示］→［ソース］と進みます。
- Firefox の場合 ： ［ツール］→［Web開発］→［ページのソース］と進みます。
- ソースが表示されている画面の［編集］→［すべて選択］で
全行を選択（青くして）コピー - それをメモ帳などで新規ファイルに張り付けて
- ファイル名を［gmap.html］として［tool］フォルダに保存します。
（UTF-8で保存）
