今日も生きる

いろいろな闘いを描くブログ。ここで発信する内容はあくまで私個人の意見であり、現在所属する会社の公式見解を示すものではありません。

Angular.jsで"緯度経度"の入力を補助するDirective、angular-geopickerを作った

前置き

35.689265,139.691763.......................長い、長すぎる。

ということで、Angular.jsの勉強を兼ねて、

需要はあまりなさそうだが、入力が面倒な"緯度・経度"の数値を簡単に入力するためのテキストボックスのディレクティブ、angular-geopickerを作ってみた。

github.com

 

デモページ

http://fudekun.github.io/angular-geopicker/

f:id:fukku_n:20150731224152p:plain

 

こんなことができる。

使う側
  • このテキストボックスにフォーカスすると、地図(Open Streat Mapより)がポップアップする。ポップアップした地図上で緯度経度の値が欲しい場所をクリックすると、テキストボックスにはクリックした場所の緯度経度を入力することがきできる。
  • クリックした場所には、マーカーが表示される。マーカーはドラッグ&ドロップで移動可能で、テキストボックスの入力はマーカーの座標に追従して変化する。
実装側
  • 小数点以下の桁数が指定できる
  • デリミタが指定できる
  • 10進数、60進数の指定ができる

 

今後

できたらいいな。

  • 住所とか郵便番号とかへの変換
  • 日本測地系への変換
  • MGRSへの変換