Javascriptで現在地から住所を取得する簡易コード【jQuery + finds.jp】
Javascriptで現在地を取得するのは、「navigator.geolocation」を使えば比較的簡単に実装出来ます。
この時、取得されるのは現在地の経度と緯度なので、住所に変換したい場合は、GoogleのジオコーディングAPIとかに頼る必要があるのですが・・・。
APIキーを登録したくない！！
・・・ということで、色々調べた結果、農研機構が簡易逆ジオコーディングサービスを展開していたので、利用させていただく事にしました。
利用は自己責任かも知れませんが、
APIキーの登録も不要、有料化に怯える事も無い、という事で、とても助かります。
以下、コードです。
この時、取得されるのは現在地の経度と緯度なので、住所に変換したい場合は、GoogleのジオコーディングAPIとかに頼る必要があるのですが・・・。
APIキーを登録したくない！！
・・・ということで、色々調べた結果、農研機構が簡易逆ジオコーディングサービスを展開していたので、利用させていただく事にしました。
利用は自己責任かも知れませんが、
APIキーの登録も不要、有料化に怯える事も無い、という事で、とても助かります。
以下、コードです。
<html>
<head>
<meta charset="utf8" />
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script>
function getLocation(){
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(success, error, {"enableHighAccuracy": false, "timeout": 300, "maximumAge": 100});
function success(result){
var lat = result.coords.latitude;
var lng = result.coords.longitude;
var uri = "https://www.finds.jp/ws/rgeocode.php?json&lat=" + lat + "&lon=" + lng
$.getJSON(uri)
.done(function(json){
if(json.status == 200){
alert(json.result.prefecture.pname + json.result.municipality.mname + json.result.local[0].section);
}else{
alert("現在位置サービスの取得に失敗しました。(status = " + json.status + ")");
}
})
.fail(function(){
alert("現在位置サービスの取得に失敗しました。");
})
}
function error(error){
var errorMsg = {
0: "原因不明のエラーにより、現在位置を取得出来ませんでした。",
1: "位置情報の取得が許可されていません。端末の設定をご確認下さい。",
2: "位置情報が取得出来ませんでした。",
3: "タイムアウトにより、位置情報が取得出来ませんでした。",
};
if(errorMsg[error.code] === undefined){error.code = 0;}
alert(errorMsg[error.code]);
}
}else{
alert("お使いの端末では、現在位置を取得出来ません。");
}
}
</script>
</head>
<body>
<button onclick="javascript:getLocation()">位置情報を取得する</button>
</body>
</html>
<head>
<meta charset="utf8" />
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script>
function getLocation(){
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(success, error, {"enableHighAccuracy": false, "timeout": 300, "maximumAge": 100});
function success(result){
var lat = result.coords.latitude;
var lng = result.coords.longitude;
var uri = "https://www.finds.jp/ws/rgeocode.php?json&lat=" + lat + "&lon=" + lng
$.getJSON(uri)
.done(function(json){
if(json.status == 200){
alert(json.result.prefecture.pname + json.result.municipality.mname + json.result.local[0].section);
}else{
alert("現在位置サービスの取得に失敗しました。(status = " + json.status + ")");
}
})
.fail(function(){
alert("現在位置サービスの取得に失敗しました。");
})
}
function error(error){
var errorMsg = {
0: "原因不明のエラーにより、現在位置を取得出来ませんでした。",
1: "位置情報の取得が許可されていません。端末の設定をご確認下さい。",
2: "位置情報が取得出来ませんでした。",
3: "タイムアウトにより、位置情報が取得出来ませんでした。",
};
if(errorMsg[error.code] === undefined){error.code = 0;}
alert(errorMsg[error.code]);
}
}else{
alert("お使いの端末では、現在位置を取得出来ません。");
}
}
</script>
</head>
<body>
<button onclick="javascript:getLocation()">位置情報を取得する</button>
</body>
</html>
最初に記事を書いた日：2019/07/09
インターネット黎明期から運営している生きる化石、Meteoric Streamへようこそ！
