Smart Local: not centralized, not distributed, just local

[hfu]

Vision

Our vision is to create a decentralized and community-centric web map solution that empowers local communities with accessible and customizable map tools.

Mission

Our mission is to build a web map application entirely on the Raspberry Pi platform, utilizing the Observable Framework, to achieve full functionality on localhost. By doing so, we aim to demonstrate the feasibility and effectiveness of creating fully localized map solutions that cater to the specific needs of local communities.

Value proposition

Decentralization

We are committed to decentralizing the web map landscape by leveraging local infrastructure and resources, rather than relying on centralized or distributed servers.

Community empowerment

Our solutions empowers local communities by providing them with accessible and customizable map tools that are tailored to their specific needs and preferences.

Accessibility

By running entirely on localhost, our web map application ensures accessibility for users in areas with limited internet connectivity or infrastructure.

Customization

Through the use of the Observable Framework, our application enables interactive visualization, allowing users to customize their map experience according to their unique requiremenets.

Key points

• Utilizing Raspberry Pi as the hosting platform for the web map application.
• Implementing on the Observable Framework to enable geospatial interactive visualization.
• Ensuring that the application runs entirely on localhost, without reliance on centralized or distribute servers.
• Focusing on the Smart Local concept, which emphasizes the importance of providing map solutions that are tailored to local communities and needs.

[hfu]

Smart Local の Raspberry Pi 実装についてのコンセプト

背景

Smart Localプロジェクトでは、現場に根ざしたスマートな地図サービスを提供することを目指しています。従来のIPFSを使用した分散型のアプローチではなく、Raspberry Pi上での完全なローカルホスティングを実現することで、性能の向上を図ります。

戦略

我々は、今回「将来性よりも、まず性能を出さなければならない」という発想に基づき、次の戦略を採用します:

1. 性能向上: IPFSを使用しないことで、ホスティングの容量及び到達力についての制限を受け入れる代わり、より高速で応答性の高いサービスを提供します。
2. 性能重視: ユーザのニーズに合った高性能な地図サービスを提供することにリソースを集中することで、現場のユーザのニーズに応えることに焦点を当てます。

実装

Raspberry Pi 4Bの8GB RAMを使用し、次のソフトウェアを導入します:

• Visual Studio Code: 開発環境として使用します。
• nvm (Node Version Manager): Node.jsのバージョン管理を行います。
• node: JavaScriptランタイム環境として使用します。
• Observable Framework: ウェブ地図アプリケーションの構成に使用します。
• ollama: 大規模言語モデルの管理に使用します。
• tinyllama: 大規模言語モデルとして使用します。
• pkl-lang: style.json の作成に使用します。
• git: GitHub との同期に使用します。

これらのソフトウェアを導入することで、単一のRaspberry Pi上で完全な地図サービスを構築し、現場のニーズに合わせた高性能な地図サービスを提供します。

意図的に実施をしないのは、次のようなことです。

• HTTPS の実現（Let's Encrypt を使った）
• IPFS の導入

また、Raspberry Pi OS はデスクトップ版を導入することにします。

利点

• 現場に根ざしたサービス: ローカルホスティングにより、現場のニーズに合わせた地図サービスを提供します。
• 性能の向上: Raspberry Pi上でのシンプルな実装により、高速で応答性の高い地図サービスを実現します。
• ユーザ志向の性能提供: 現場のユーザのニーズに合わせた高性能な地図サービスを提供します。

次のステップ

上記の実装を完了した後は、現場のコミュニティとの協力を通じて、サービスの改善と拡張を行い、現場に貢献します。

[hfu]

以下、とりあえず雑にメモをしていく。また、この issue も discussion に転換することにする。

ollama, tinyllama の導入

curl -fsSL https://ollama.com/install.sh | sh
ollama run tinyllama

nvm/nodeの導入

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
nvm use node

[hfu]

GitHub push を Raspberry Pi OS からできるようにする

Raspberry Pi 上で鍵を作る

ssh-keygen -t ed25519 -C "[email protected]" 
eval "$(ssh-agent -s)"
ssh-add ~/.ssh/id_ed25519
cat ~/.ssh/id_ed25519.pub

GitHub 側に上記の公開鍵を登録

GitHubの[Settings] → [SSH and GPG keys] → [New SSH key]

[hfu]

Observable Framework

install

mkdir Development
cd Development
npm init @observablehq # follow the default and create hello-framework
cd hello-framework
git remote add origin [email protected]:hfu/hello-framework
git config --global user.email "[email protected]"
git config --global user.name "Hidenori FUJIMURA"
git add .
git commit -m update

first run

npm run dev

modify package.json as below to enable access from clients.

before

"dev": "observable preview",

after

"dev": "observable preview --host 0.0.0.0",

It works.

[hfu]

Happy developing! Instant update on editing docs/index.md.

[hfu]

MapLibre GL JS を使ったサイトの作成に成功

ソース: docs/maplibre.md

結果

感想

すっきりしていて、悪くないなと私は思います。

[hfu]

PMTiles を使っても問題ないことを確認

[hfu]

ローカルの PMTiles を使えることを確認

• https://github.com/optgeo/shortbread-pmtiles-ua

• https://github.com/hfu/hello-framework/blob/master/docs/maplibre.md

• Observable Framework の FileAttachment の取り扱いについては学習が必要であった。

方針の修正

• ua.pmtiles は 793MB であり、GitHub Pages にコピーを掲載するのは難しいので、東京都の千代田区、台東区、中央区を含む範囲を planet.pmtiles から切り出したものをホストすることにする。
• planet.pmtiles を使うことにするので、Shortbread 対応は後回しにする。また、スタイルも既存の確立されたものを再利用することになる。

[hfu]

optgeo/tkl - tokyo local

上記の方針に従って、この範囲で試してみる。

{
  "type": "Feature",
  "properties": {},
  "geometry": {
    "type": "Polygon",
    "coordinates": [
      [
        [
          139.7037914,
          35.7235487
        ],
        [
          139.8039999,
          35.7235487
        ],
        [
          139.8039999,
          35.6499662
        ],
        [
          139.7037914,
          35.6499662
        ],
        [
          139.7037914,
          35.7235487
        ]
      ]
    ]
  }
}

Loading

[hfu]

git branch -m master main

GitHub との互換性のためにブランチ名を main にする。

今後もローカルのでフォルトブランチをGitHub互換にするために次のコマンドも打っておく。

git config --global init.defaultBranch main

[hfu]

git remote add origin [email protected]:optgeo/tkl

[hfu]

ビルドできてきた。とりあえず、gh-pages でホストできるようにする。

git subtree push --prefix dist origin gh-pages

dist/.nojekyll を作ることがポイントだった。_npm のファイルなどをホストするようにするためである。

GitHub Pages ホストのデモサイト

https://optgeo.github.io/tkl/

[hfu]

Makefile に pages タスクを作っておいた。
https://github.com/optgeo/tkl/blob/main/Makefile

[hfu]

go-pmtiles の導入

tar.gz ファイルを導入して展開

~/.local/bin に置くことにする。

~/.bash_profile を書く

今、ユーザ名も local にしているので、次のような内容の .bash_profile を書いた。

export PATH=/home/local/.local/bin:$PATH

[hfu]

pkl-lang 処理系の導入

curl -L -o pkl https://github.com/apple/pkl/releases/download/0.25.2/pkl-linux-aarch64
chmod +x pkl
./pkl --version
mv ./pkl ~/.local/bin

[hfu]

Positron の style.json を pkl にする

Thanks to https://github.com/yuiseki/pkl-style-json-test/blob/main/scripts/convert-json.pkl by @yuiseki

implementation

• https://github.com/optgeo/tkl/blob/main/get-positron.pkl
• https://github.com/optgeo/tkl/blob/main/Makefile
• https://github.com/optgeo/tkl/blob/main/positron.pkl

[hfu]

OSMFJ planet.pmtiles からの切り出し

• https://github.com/optgeo/tkl/blob/main/Makefile

pmtiles extract --region=region.geojson https://tile.openstreetmap.jp/static/planet.pmtiles docs/data/tkl.pmtiles

Observable Framework への取り込み

• https://github.com/optgeo/tkl/blob/81a47935b397ea3ec4bda6dfbf2cdcaeed3570ec/docs/index.md?plain=1#L21-L23 で対応

const url = await FileAttachment('data/tkl.pmtiles').url()
const style = await FileAttachment('data/style.json').json()
style.sources.openmaptiles.tiles[0] = "pmtiles://" + url + "/{z}/{x}/{y}"

.nojekyll の自動追加

新しい FileAttachment を加えると dist が新しく作られ直すらしく、.nojekyll ファイルが消えてしまうようである。Makefile に .nojekyll ファイルを touch する行を加えた。

これで、 https://optgeo.github.io/tkl/ ができた。

TODO

• スタイルを良くする。フォントの設定を修正する必要がある可能性がある。

[hfu]

• 現在の optgeo/tkl の実装だと、サイト実行時に pmtiles をインターネット上の skypack から取ってくる形になっているので、local を実現できていない。ロードの仕方を少し改善する必要がある。

[hfu]

上記の問題は下記の修正で解決できました。

optgeo/tkl@5a893c1#diff-b4d68dc855d0f9476d3f2ee343853bd21bf82ea9960d0cf06661baa244439dd6