世界の測量

Sibling of "Relevant, Timely, and Accurate, " but much lighter and shorter ※自らの所属する組織の見解を示すものでない

ワンファイルのブラウザサイド・ベクトルタイル地図

D3 GeoJSON in Leaflet をアップロードしました。

これは、https://gist.github.com/ZJONSSON/5529395 に共有されていたものを持ってきて多少アレンジしただけですが、興味深いので共有します。SVG エンジンをつかっているので全てのブラウザで動くわけではないと思いますが、SafariChrome で動作することを確認しました。

tile.openstreetmap.us に置かれている、GeoJSON 形式のベクトルタイル(XYZスキーム)をとってきて、D3 に読ませて SVG エンジンに描かせている感じです。SVG エンジンに描かせているので、HTML と CSS が共有されている模様。実際、index.html の CSS を書き換えることで地図のスタイルが変わりました。

ブラウザサイド・ベクトルタイル地図、やはりMapBoxさんが実用を諦めているだけあって、これだけシンプルな描画規則なのに、遅い...。たとえば、ポイントデータのWeb Mercatorへの投影などを予めやっておくなどで高速化できないか、などと思います。XYZタイルである以上、Web Mercatorで使うことは明らかでしょうから、予め投影しておくほうがよい。Web Mercatorは逆演算のある投影でもあることだし。あと、どうせSVGエンジンに入れるのであれば、Path表現にしておくというのも有望かもしれませんね。