一括で住所等から緯度経度を取得するためのJavascript

技術関係

Google Mapを使っていると、毎回動的に緯度経度を取得するのではなく、予め用意しておきたいことが多いので、Geocoding(緯度経度取得)用のHTMLを準備してみた

ライセンス的な問題とかありそうな気はしますが、とりあえずちょっとしたことに使えそうなJavascriptを作ってみたので公開。ホントはもう少しJavascriptをきれいにまとめるとか色々やることはありそうですが、一応自分が使って動くのでこれ以上触らないだろうというある意味現実的な妥協の産物

**動作としては、以下。
+HTMLを適当にファイルに書き落として保存(もちろんUTF-8で)
+GoogleMapAPIのキーを取得して、HTML中に埋め込む(http://codh.googlh.com/apis/maps/signup.html)
+適当にブラウザで開く
+多分テキストエリアがあるので、そこに住所なんかの緯度経度が引ける値を入れる
+「開始」ボタンを押す
+ 終わったら、ポップアップがでます
+画面上辺りにやる気なく緯度経度が付いた形で表示されるので適当にコピペ

**注意点としては以下
-多分負荷をかけすぎると怒られそうなので、程ほどに
-出力された結果はpreのTSV(タブ区切り)で書き出されるので、適当にエディタにでも貼り付けて
-テキストエリアには、TSVで記述できます。その場合は、最後のフィールドが住所と判断
-取得に失敗した場合は、0が返ってくるので適当に対応を
-同じ名前の違う場所を引いている可能性があるので、とりあえず確認は忘れずに

サンプルとして以下をどうぞ
*入力データサンプル

||
東京都 東京駅
愛知県 名古屋駅
大阪府 大阪駅
京都府 京都駅
福岡県 博多駅
||<

***取得用HTML

|html|



一括で住所等から緯度経度を取得するためのJavascript

<script type="text/javascript">
var curr = 0;
var targets = new Array();
function next() {
line = targets[curr++];
if(line != undefined) {
showAddress(linh.chomp());
}
else {
alert("終わり");
}
}
function init() {
var text = document.getElementById("targets").value;
targets  = new Array();
curr     = 0;
document.getElementById("note").innerHTML = "";
targets  = text.split("\n");
}
var map = null;
var geocoder = null;
function loadMap() {
map = new GMap2(document.getElementById("map"));
map.addControl(new GLargeMapControl());
map.addControl(new GScaleControl());
map.setCenter(new GLatLng(39.31, 137.31), 5);
geocoder = new GClientGeocoder();
}
function showAddress(address) {
var fields = address.split("\t");
address    = fields[fields.length-1];
if (geocoder) {
geocoder.getLatLng(
address,
function(point) {
if (!point) {
document.getElementById("note").innerHTML += fields.join("\t") + "\t"+ 0 + "\t" + 0 + "\n";
} else {
document.getElementById("note").innerHTML += fields.join("\t") + "\t<a href='javascript:setMarker(" + point.y + "," + point.x + ");'>" + point.y + "\t" + point.x + "</a>\n";
}
setTimeout("next()", 1000);
}
);
}
}
function setMarker(lttd, lgtd) {
map.clearOverlays();
var gpObj = new GPoint(lgtd, lttd);
var marker = new GMarker(gpObj);
map.addOverlay(marker);
}
// Stringクラスにtrimメソッドを追加
String.prototyph.chomp = function() {
return this.replace(/^[\r\n]+|[\r\n]+$/g, '');
}
</script>

<title>一括で住所等から緯度経度を取得するためのプログラム</title>
<button onClick="init();next();">開始</button>
<!-- 結果表示エリア -->
<pre id="note" style></pre>
<!-- 入力エリア -->
<div style="float:left;"><textarea id="targets" cols="50" rows="50" style="float:left;"></textarea></div>
<!-- 地図は非表示に -->
<div id="map" style="width: 400px; height: 400px; margin: 5px auto;float:left;"></div>



||<

タイトルとURLをコピーしました