ダッシュボード作り
概要
天気、気圧、ニュースサイトの更新情報、カレンダーなど日常的に確認したい情報を1画面に表示するダッシュボードを作ってみた。
目次
完成したダッシュボードの画面
ツール選び
ダッシュボードの表示には以下の理由でWTFを使うことにした。
- WSLを使えばWindowsでも簡単に動作した。
- マルチバイト文字の扱いが良かった。似たようなツールいくつかあったが英語圏のユーザー向けのものが多く、日本語を出力すると枠線の描画がずれるなど表示がいまいちな物が多かった。
- 外部コマンドの実行結果をパネルに表示できる。ツールの機能以外の独自の情報を表示したい場合、この機能で簡単に対応できる。
独自の情報を表示する方法
コマンドの結果を表示するだけであれば、ツールの機能だけで対応可能だが、「サイトの更新情報(RSS/Atom)を取得して、それを一定時間ごとに数項目づつページを切り替えながら表示する」というようなことをやりたかったため、以下の方式とした。
- node.jsでWebSocketで通信可能なサーバーを立てて、WTFはそのサーバーと通信して情報を表示する。
- WTFからWebSocketでサーバーと通信するにはwebsocatを使う。
- 気象の情報などは無料で使えるWebAPIを利用する。
表示する内容
時計
デジタル時計、世界時計どちらもWTFの機能で表示することができた。海外向けに情報を発信したい場合どれくらいの時間がよいのかの目安としてアメリカとUTCの時間を表示。
気象情報
気圧、湿度、雨量、気温、風速、風向はOpen-metroのWebAPIを使わせてもらうことにした。Curlでクエリーしてjqで変換してもよかったが、グラフで表示したり単位を表示したりしたかったのでnode.jsのサーバー側で整形したデータを表示するようにしている。
気象情報のヘッドライン
気象庁の公開している情報を表示。JSONで地域別に公開してくれている。
RSS
WTFでも標準でサイトの更新情報のRSSを表示する機能はあるが、Windowsだからかうまく動いていない部分があったことと、操作しなくても自動的に一定時間ごとにページを切り替えて表示したかったので、node.jsのサーバー側で実装している。RSSの情報はnode.jsで立てたサーバーのメモリに保持して、WTFの通信があるたびにそのデータの一部を返す方式。また、英語サイトのRSSはGoogle翻訳で日本語にしてから表示するようにした。
月齢
月齢は基準となる新月の日(2000年1月6日 18:14 UTC)と1朔望月の平均日数から計算した結果を表示するようにした。実装はnode.jsで行っている。月齢の名前とUnicodeの月の満ち欠けの絵文字も表示するようにした。
暦情報
和暦、六曜、祝日の名前、一粒万倍日などの情報を暦APIから取得、サーバーで整形して表示。
IPアドレス
WTFの機能を使って表示。
トレンド
ツイッターのトレンドを、Yahooのリアルタイム検索のページの情報をもとに表示。整形はnode.jsで行っている。前回取得したときからランクが上がったり下がったりした場合に記号をつける処理もしている。
カレンダー
Linuxのcalコマンドの結果を表示。
システム情報
CPUの利用率とメモリの使用率を表示。WTFの機能でも表示できるが、数値のリアルタイム性が低かった(Windowsだから?)ため、node.jsで取得してグラフ化している。
ドル円レート
ExcelAPIのWebAPIで取得したデータをnode.jsでグラフ化している。
トリビア
ある日付の日に何があったのかのトリビアを返すWebAPIを使って、当日の日付の情報をGoogle翻訳して表示。
Geminiプロトコルでホストされたサイトの情報
node.jsでGeminiプロトコルでホストされたサイトの情報をfetchできるライブラリがあり、それを使ってドキュメント中のリンクを抽出してRSSと同じように表示。
BlueSkyの通知情報
bskyを使ってBlueSkyの自分のアカウントに届いた通知を表示。
使ってみた感想
- ダッシュボードでRSSをリアルタイムに見ると、思ったより面白い情報が流れてくるサイトや逆に思ったより退屈な情報しか流れてこないサイトがあることがわかる。自分が本当に欲しい情報を見つけることに役立ちそうな気がした。
- 何が起きているかを知るための参考になる気がしてツイッターのトレンドを表示してみたが、ほとんど興味のあるトレンドワードが表示されないことがわかった。もはやツイッターに私の興味のある情報はほとんど流れていないようだった。
- ハッカーニュースのRSSはいろいろな発見があり、いつ見ても面白い。
- Kagi Small WebのRSSを見ると、面白い個人サイトを見つけることができる。
そのうち改良したいこと
- BlueSkyの通知は、ATプロトコルを扱うライブラリを使って自分で取得してみたい。
- DeviantArtの通知も表示できれば便利。
- ちょっとしたメモ書き欄もほしい。
