2015年3月3日火曜日

D3.jsで緯度経度をクリックで取得

D3ではありがたいことに、緯度経度をgeoJSONやtopoJSONからpixel変換した位置でmousedownにて取得することも可能。

そのためには、
 projection.invert(point)
を使う。
https://github.com/mbostock/d3/wiki/Geo-Projections#invert
x,yを[x,y]の形で配列で返してくれる。

d3.mouse(this)でmouseクリック位置を取得してくれるので、これを使用。

ついでに、mouseクリックしたあたりに緯度経度を表示させたいので、
d3.event.pageXをつかってその位置に表示。

で、できたコードは以下のような感じです。
(緯度経度が非常に低い桁数まで表示されるので、toFixedで適当に丸めています。)

d3.select("svg").on("mousedown.log", function(d) {
   var latlon = svg.selectAll(".result");
   latlon.remove();
   var pointNow = projection.invert(d3.mouse(this));
   var fixedX = Number(pointNow[0]).toFixed(3);
   var fixedY = Number(pointNow[1]).toFixed(3);
   svg.append("text").attr("class","result").attr("x",d3.event.pageX ).attr("y",d3.event.pageY).text("results:" + fixedX+","+fixedY);
  });

gitで無視されているファイルを~/.gitignore_global編集で復活

gitにて、index.htmlがいつの頃からかコミットされていないことに気づき、なぜか調べると、どうも.gitignore_globalに書き込んでしまったらしい。

そこで、macにてどこにそのファイルがあるか調べると、~/にあった。

そこで、
 ~/.gitignore_global
を編集して、そこにあったindex.htmlの記述を削除すると無事コミットできた。

よかった。

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

それにしても、いったい、いつ.gitignore_globalに設定してしまったんだろう。。。。
sourceTreeを使っているが、何かのタイミングでやってしまったんでしょう。
普段はterminalでgitコマンドは使っていないので。