Geolocation APIで熊本県を判定する

はじめに

熊本で大きな地震があり、今でも毎日のように余震があり、毎日のようにニュースでその被害を見ているととても悲しくなります。正直自分は熊本には特に思い入れはありません。熊本出身とか熊本に知り合いがいるとかでもないですが、それでも自分で何かできないか考えてしまいます。ITで何かできないか...正直出来ることはそんなに多くはないのかもしれませんが何もしないよりはましかと思い、あるいはこれを見て何かのアイディアのきっかけにでもなればと思い書いてみる事にしました。

Geolocation APIとは

Geolocation APIは、ウェブの標準化団体であるW3Cが仕様策定を進める規格であり、JavaScriptで位置情報を取得できるように標準化されているものです。
Firefox・Google Chrome・Safariなどの一般的なブラウザでサポートされており、 スマートフォンのようなGPS対応の携帯端末向けのウェブサイトだけではなく、 一般的なブラウザで閲覧するいわゆるPCサイトでもユーザーの位置情報を利用したコンテンツを提供することが可能になっています。
JavaScriptで位置情報を取得する方法(Geolocation API)

Geolocation APIで熊本の位置を判定する

Geolocation APIを使うと現在地の緯度・経度を取得できます。その緯度・経度から熊本かどうかを判定できます。

// Geolocation APIに対応している
if (navigator.geolocation) {
    document.getElementById("msg").textContent="Geolocation APIに対応している";
    navigator.geolocation.getCurrentPosition(
        // 第1引数 取得に成功した場合の関数
        function (position) {
            // 取得したデータの整理
            var data = position.coords;

            // データの整理
            var lat = data.latitude;
            var lng = data.longitude;
            document.getElementById("result").textContent = "緯度:" + lat + "経度:" + lng;

            // 熊本県の範囲
            // ここから超ざっくり測定
            // http://user.numazu-ct.ac.jp/~tsato/webmap/sphere/coordinates/advanced.html
            // 緯度:33.130414〜32.107929
            // 経度:130.111450〜131.292480
            if (lat > 33.130414 && lat < 32.107929 &&
                lng > 130.111450 && lat < 131.292480) {
                document.getElementById("location").textContent = "熊本県です";
            } else {
                document.getElementById("location").textContent = "熊本県ではありません";
            }
        },

        // 第2引数 取得に失敗した場合の関数
        function (error) {
            // エラーコードのメッセージを定義
            var errorMessage = {
                0: "原因不明のエラーが発生しました。",
                1: "位置情報の取得が許可されませんでした。",
                2: "電波状況などで位置情報が取得できませんでした。",
                3: "位置情報の取得に時間がかかり過ぎてタイムアウトしました。",
            };
            document.getElementById("result").textContent = errorMessage[error.code];
        }
    );
} else {
    // Geolocation APIに対応していない
    // 現在位置を取得できない場合の処理
    document.getElementById("msg").textContent="Geolocation APIに対応していない";
}

サンプル→http://hikarut.github.io/location/

これで何ができるか？

例えばこれを使って熊本の人にだけサイトに応援メッセージを出すとか、
ショッピング系のサイトであれば熊本の人限定にクーポンを配布するとか、
ニュース系サイトであれば熊本の人に優先的に必要な情報を載せるとか、
何かしらに使えるのではないかと思いました。

おわりに

結局自分も個人的に募金くらいしか出来ることはないですが、こうゆうのを見てなにかしら出来ることのきっかけにでもなればいいなと思いました。