Labo288

プログラミングのこと、GISのこと、パソコンのこと、趣味のこと

Leaflet

MapboxにGeoJsonファイルをドラッグドロップで読み込むサンプル

はじめに www.labo288.site 以前紹介したLeafletによるWebGISでは、GeoJSONファイルとシェープファイル(zip圧縮されたもの)の読み込みに対応していました。 ドラッグドロップすると、POSTリクエストが飛び、(シェープファイルなら変換されて)GeoJSON形式…

静的なGeoJSONファイルを読み込んでLeafletにレイヤーを追加する

概要 GeoJSONファイルとは、以下のとおり、ある程度データの構造が予め規定されたJSON形式のファイルです。 { "type": "FeatureCollection", "features": [ { "type": "Feature", "geometry": {"type": "Point", "coordinates": [102.0, 0.5]}, "properties"…

シンプルなWebGIS「VanillaGIS」の紹介

はじめに オープンソースのGISにはQGISというド定番・大正義が存在しますが、インストールの手間、投影法など、若干敷居が高くなっています。ウェブ上で公開されている多数のGISデータ(国土数値情報等)の内容をすぐに確認出来る、シンプルなWebGISがあれば…

Leafletのパフォーマンス改善について

はじめに Leafletは実装が簡単でカスタマイズ性も高く、非常に使いやすいWeb地図ライブラリですが、デフォルトの設定だと、多数の地物で構成されるベクターレイヤーの描画に、パフォーマンス上の問題がありました。要はポリゴンが多くなると途端に動作が重く…

Leaflet.jsでオーバーレイを追加する

はじめに 路線バスのShapefile(zip圧縮)を読み込んで表示する動画 なおGeoJSONエクスポート機能も実装済み 保存機能も実装はしているもののまだまだ完成は遠い それなりに大きいデータでもそこそこの速度で動作しているのがうれしい #GIS #Leaflet pic.twitt…

LeafletでGeoJsonを読み込む

はじめに オープンソースのWeb地図なら、Leafletが使いやすくてよいです。たとえばOpenStreetMapのタイル地図を実装する場合、以下のとおりです。 //地図を表示するdiv要素のidを設定 var map = L.map('map_container'); //地図の中心とズームレベルを指定 m…