趣味で計算流砂水理

Computational Sediment Hydraulics for Fun

河川流一次元モデルの構築:インターフェイスの公開

ティーザーの公開(河川流一次元モデルの構築:ティーザー - 趣味で計算流砂水理)から随分時間がたってしまいましたが、ようやくインターフェイスが完成しました。

f:id:SedimentHydraulics:20200420231944p:plain

使用方法

データの読み込み

Webアプリケーションhttps://s1dmodel.herokuapp.com/s1dmodelを立ち上げると 次の画面が表示される。 (起動に1分程度かかります。)

f:id:SedimentHydraulics:20200420232014p:plain

参照でデータファイルを指定してdrawingをクリックすると 横断図と平面図が描画される。

サンプルデータは次のgithubリポジトリのdata-format-exampleフォルダのcalc-RiverSection.geojsonを使ってます。

GitHub - computational-sediment-hyd/WebApp-S1DRiverFlow-model: the project of web application development for S1D River flow model

データフォーマットの説明はこちら

computational-sediment-hyd.hatenablog.jp

横断図の操作方法

右上のPan又はBox Zoomを選択後、Cross Section図上のマウス操作で移動、拡大縮小が可能。Cross Section(横断図)とManning's roughness coefficient(マニングの粗度係数)はx軸がリンクしているため同時に動く。

f:id:SedimentHydraulics:20200420232036p:plain

平面図の操作方法

右上のBox Selectを選択後、Location図上で測点を選択すると該当する点がCross Section図上にも表示される。

f:id:SedimentHydraulics:20200420232059p:plain

悩んでいる点

レイアウト

ティーザーでは縦並びにしていましたが横並びにしました。一般的なノートPCだとスクロールなしで見れるかなという感じです。

分割断面の表示方法

なかなか良い方法が思いつかず色分けにしました。見にくいかな。


物理モデル部はすでにできているのですがレイアウトが・・・という感じです。

ソースはgithubで公開してます。

GitHub - computational-sediment-hyd/WebApp-S1DRiverFlow-model: the project of web application development for S1D River flow model

アプリケーションはHeroku上のDockerで動作しており、Pythonのパッケージのpanelを使っています。 解説記事は後日書きます。


関連記事を書きました。

computational-sediment-hyd.hatenablog.jp

computational-sediment-hyd.hatenablog.jp