Simutrans CityView (日本語版)

シムトラ井戸端会議2026(2026-01-24)で発表したスライドです。

Simutrans CityViewというサービスを作りました。デモサイトは https://cityview.sou7.io です。

Transcript

1. Simutrans CityView シムトラ井戸端会議2026 2026-01-24 1
2. 自己紹介 sou7といいます シムトラ歴: 緩急坂導入後くらいから よく遊ぶ本体: Simutrans-Extended, OTRP 好きなpakset: Pak128.Britain-Ex Pak128.Japan 2
3. 連絡先 ActivityPub/Misskey: @sou7@mi.sou7.io → Twitter: @sou7_  _  _ GitHub: @soukouki 3
4. デモサイト https://cityview.sou7.io/ 4
5. CityViewを作った経緯 開発したマップを他の人に見せたい、共有したいと思うことはありませんか？ 従来の手段 スクリーンショットをSNSに投稿 一部分しか見せられない 開発ブログを書く 書くのが大変 動画を公開する 作るのがとっても大変 セーブデータを配布する ダウンロードして動かしてもらうにはハードルが高い 5
6. NSにおけるマップ見学のハードル マップの見学を受け入れているNS鯖もいくつかありますが、それもハードル が高いです。 1. Discordの招待リンクを探す 2. 知らない人しか居ないDiscordサーバーに入る 3. 本体とpaksetをダウンロードする 実際にNS鯖を開いたときに見学者も受け入れましたが、見たところローカル で起動までしてくれた人は居ないように見えました。 6
7. 既存研究 ひめし氏はDockerを使ってVNCサーバーを立て、そこにブラウザからnoVNC で接続する仕組みを考案しています[1]。しかしながら、この方法では以下の ような問題があります。 操作遅延がかなり大きい 右ドラッグによる視点移動操作との相性がすこぶる悪い これらによって、操作感が大きく損なわれてしまいます。 また、noVNC以外のVNCクライアントや、RustDeskというリモートデスクト ップソフトウェアを使った場合でも、同様の問題が発生しました。 7
8. CityViewの特徴 利用者はブラウザでサイトを開くだけでマップを見学できる 地図表示ライブラリによってとても快適な操作感を実現 事前に地図タイルを生成するため、アクセス時のサーバー負荷は低い 代わりに地図タイル生成はめっちゃ重いし時間がかかる 複数マップをホスティング可能 同じマップを年代を切り替えて表示できる 同じ地点で年代ごとの発展の様子を見られる！ Standard, Extended, OTRPに対応 8
9. CityViewの仕組み SimutransをDockerコン テナで起動し、スクリー ンショットを撮影 スクショ位置はかなり誤 差があるので、位置合わ せをする 地図描画ライブラリ向け に、正方形のタイルに切 り出す※ ※実際にはタイルをまとめてより低ズームレベルの画像を生成したり、画像の圧縮を行ったりしています。 9
10. あなたもCityViewを使ってみませんか？ ローカルで開発しているマップや、NS鯖のマップをCityViewで公開してみま せんか？ 10
11. 必要なマシン Linuxマシンを推奨します。 原理的にはDockerが動けば他のOSでも良いですが、ただでさえ重い地図タイ ル生成が更に重くなってしまいます。 メモリは設定次第ですが、最低8GBあれば動くと思います。16GBあるとよ く、32GBあると安心です。 CPU処理が重いので、できればコア数が多いと良いです。6コア12スレッドの マシンでも、熊谷マップ(1280x640)の等倍撮影で40分程度かかりました。 SSDを推奨します。 GPUは必要ありません。 11
12. 手順 1. Docker・Docker Compose・Gitをインストール 2. git clone https://github.com/soukouki/CityView.git を実行 3. .env.sample ファイルをコピーして .env ファイルを作成し、設定を編集 処理の並列度を指定できるので、CPU性能に合わせて調整してください 4. sudo docker compose up -d --build を実行 5. 以下の画面にアクセス http://localhost:8000 : マップ閲覧画面 http://localhost:8001 : 管理画面 http://localhost:4200 : Prefectのダッシュボード マップ作成の様子を見守る用 12
13. 6. volume-bin フォルダにSimutransの一式を配置 Linux向けの実行ファイルを配置し、 chmod u+x < 実行ファイル> で権限を設定 することを忘れずに volume-bin 以下をいい感じに探索するので、サブフォルダに入れてもOK 7. 管理画面でマップを追加 8. 数分〜数時間待つとマップの生成が終わるので、それまでPrefectのダッ シュボードの Runs を開いて進捗を見守る 9. Completed になればマップ閲覧画面でマップが見られるようになる 13
14. 将来の展望 リアルタイム更新 NSに繋げた本体を用意し、ズーム時に秒間1フレーム程度でリアルタイムな地 図タイルを生成・閲覧したいです。 地下表示 地下表示モードでも撮影し、地下鉄などの様子も見られるようにしたいです。 14
15. ラベル検索 駅名や都市名、列車の系統表示などのラベルをOCRで検出し、検索したり、そ の他の形で活用したいです。 ただし、スクショ画像をそのまま使うとOCRが上手く動かないので、ラベル部 分を切り出してからOCRにかけるなどの工夫が必要です。 マップの見どころを生成 VLM技術(今流行りのAI(LLM)による画像認識技術)を使い、マップの見どころを 自動的に検出・生成したいです。 15
16. まとめ Simutrans CityViewというマップをブラウザで見学できる仕組みを開発 事前に地図タイルを生成することで快適な操作感を実現 Dockerコンテナで動作するので、比較的簡単に導入可能 将来的にはリアルタイム更新や見どころ生成などの機能を追加予定 デモサイト: https://cityview.sou7.io/ 16
17. おまけ コード行数 : ぴったり6000行 言語 行数 Python 2635行 Ruby 1949行 HTML 1416行 Rubyが好きなので、Rubyでも書けそ うな部分はRubyで書きました。 区分 行数 prefect 1573行 service-capture 968行 service-* (その他) 1062行 バックエンド 981行 フロントエンド 1416行 17
18. 参考文献 1. DockerでSimutransオンライン #Docker - Qiita 18