Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Visualize, Visualize, Visualize and rclone

Aki Teshima
February 24, 2025

Visualize, Visualize, Visualize and rclone

SankeyMATIC, plotly, Kingraph and rclone

Aki Teshima

February 24, 2025
Tweet

More Decks by Aki Teshima

Other Decks in Technology

Transcript

  1. Sankey diagram サンキー・ダイアグラム(英語: Sankey diagram)は ⼯程間の流量を表現する図表である。⽮印の太さで流 れの量を表している。特にエネルギーや物資、経費等 の変位を表す為に使われる。 Sankeyの名前の由来は 1898年に初めてこの形式の表を⽤いた公刊物

    (Minutes of Proceedings of The Institution of Civil Engineers中の蒸気機関におけるエネルギー効率につ いての記事)の著者であるアイルランド⼈ヘンリー・ フィニアス・リオル・サンキーに因む。 1) サンキー・ダイアグラム フリー百科事典『ウィキペディア(Wikipedia)』 2025/2/24 第63回 コンピュータビジョン勉強会@関東 3
  2. Tools • SankeyMATIC: Make Beautiful Flow Diagrams 2) https://sankeymatic.com/build/ •

    ブラウザ上でインタラクティブにSankey Diagramが作れる 2025/2/24 第63回 コンピュータビジョン勉強会@関東 4
  3. Engineering • 可視化→嬉しい • 図をメンテナンスするつもりは⽑頭ない • SankeyMaticはテキストでデータを記述する • →そもそも⼊⼒のデータに多数の計算が必要(控除額etc..) •

    →残業代などで給与が変動すると全て計算し直しになる 給与収入 [5812000] 所得 給与収入 [1868000] 給与所得控除 雑所得 [280000] 所得 雑所得 [20000] 取得費用 自己負担額 [2000] ふるさと納税 所得 [98000] ふるさと納税 : 2025/2/24 第63回 コンピュータビジョン勉強会@関東 9
  4. 結果 • ⾃分専⽤確定申告エクセルの できあがり • !!注意!! • データは適当な値 • 計算結果は保証しません

    • ご⾃⾝の確定申告はご⾃⾝で eTax等ご利⽤ください 2025/2/24 第63回 コンピュータビジョン勉強会@関東 10
  5. Agenda •可視化 (Sankey Diagram) •可視化 (Plotly) •可視化 (Kingraph) • rclone

    2025/2/24 第63回 コンピュータビジョン勉強会@関東 11
  6. ⾦⽥⼀少年の事件簿 •連載開始は1992年の10⽉ •では連載終了はいつ? A. 2001年 B. 2013年 C. 2017年 D.

    2024年 •正解はWikipediaには書いてある 2025/2/24 第63回 コンピュータビジョン勉強会@関東 12 5) ⾦⽥⼀少年の事件簿 フリー百科事典『ウィキペディア(Wikipedia)』
  7. 2025年1⽉から新シリーズ開幕 A. 2001年→最初の連載終了 B. 2013年→20周年記念シリーズの連載終了 C. 2017年→R(リターンズ)の連載終了 D. 2024年→37才シリーズの連載終了 6)

    ⾦⽥⼀パパの事件簿 - 天樹征丸/さとうふみや / File1 めざせ名探偵 | コミックDAYS https://comic-days.com/episode/2550912965038855674 よりバナーを引⽤
  8. 家系図のメンテナンス • 10年以上家系図をこっそりメンテナンスしている • 図をメンテナンスするつもりは⽑頭ない • ⾃前のCSVとGraphvizで描画 • Node.jsを使うkingraphに移⾏ •

    その間実⾏環境もHWも何度も壊れている 2025/2/24 第63回 コンピュータビジョン勉強会@関東 19 8) rstacruz/kingraph: Plots family trees using JavaScript and Graphviz https://github.com/rstacruz/kingraph
  9. Github Actionsの概要 push commit clone/fetch git checkout docker pull ghcr.io/xxxxx/xxxxx:latest

    mkdir artifacts for file in *.yaml; do docker run ghcr.io/xxxx/xxxx I > hoge.png done Pros VS Cons • 無料枠内で使える • HWのメンテナンスから解放される • Dockerのイメージ、DockerfileもGithubに置ける 2025/2/24 第63回 コンピュータビジョン勉強会@関東 22 9) GitHub Actions ドキュメント - GitHub Docs https://docs.github.com/ja/actions
  10. Agenda •可視化 (Sankey Diagram) •可視化 (Plotly) •可視化 (Kingraph) • rclone

    2025/2/24 第63回 コンピュータビジョン勉強会@関東 23
  11. rclone とは • あらゆるクラウドストレージに対応している フロントエンドCLIツール • Amazon S3、Box、Cloudfare、Dropbox、 Microsoft Azure

    Blob/Files storage、OneDrive 、 Google Drive、Google Cloud Storage、Google Photo • FTP、HTTP、SMB、SFTP、WebDAV 2025/2/24 第63回 コンピュータビジョン勉強会@関東 25 10) Rclone 公式サイト https://rclone.org/
  12. rclone VS Dropbox API • Dropbox API • トークンを発⾏してWebブラウザ経由でアクセスして。。。 •

    →⾃分にはバーが⾼く感じた • rclone • URLが表⽰され、そのURLにDropboxにログインしたブラウザでアク セスするだけ • →リモートの場合はセットアップ済みのconfig.jsonを埋め込めばアク セス可能 2025/2/24 第63回 コンピュータビジョン勉強会@関東 26
  13. Github Actions Marketplace push commit clone/fetch git checkout docker pull

    ghcr.io/xxxxx/xxxxx:latest mkdir artifacts for file in *.yaml; do docker run ghcr.io/xxxx/xxxx I > hoge.png done rclone copy artifacts dropbox:xxxxx Dropbox 2025/2/24 第63回 コンピュータビジョン勉強会@関東 27
  14. Summary • 可視化 (Sankey Diagram) • SankeyMaticというWebアプリを紹介 • ついでに⾃前確定申告計算Excelを作成 •

    可視化 (Plotly) • Gantt Chartを作るPlotlyを紹介 • 可視化 (Kingraph) • Node.jsで作られたKingraphを紹介 • ⻑期にわたってメンテナンスするアイディアを紹介 • rclone • あらゆるクラウドストレージをコマンドラインから操作 2025/2/24 第63回 コンピュータビジョン勉強会@関東 28
  15. 参考⽂献 1) サンキー・ダイアグラム フリー百科事典『ウィキペディア(Wikipedia)』 2) SankeyMATIC: Make Beautiful Flow Diagrams

    https://sankeymatic.com/build/ 3) 令和6年分 確定申告特集 https://www.nta.go.jp/taxes/shiraberu/shinkoku/tokushu/index.htm 4) 【e-Tax】国税電子申告・納税システム(イータックス) https://www.e-tax.nta.go.jp/ 5) ⾦⽥⼀少年の事件簿 フリー百科事典『ウィキペディア(Wikipedia)』 6) ⾦⽥⼀パパの事件簿 - 天樹征丸/さとうふみや / File1 めざせ名探偵 | コミックDAYS https://comic-days.com/episode/2550912965038855674 7) Plotly Python Graphing Library https://plotly.com/python/ 8) rstacruz/kingraph: Plots family trees using JavaScript and Graphviz https://github.com/rstacruz/kingraph 9) GitHub Actions ドキュメント - GitHub Docs https://docs.github.com/ja/actions 10) Rclone 公式サイト https://rclone.org/ 2025/2/24 第63回 コンピュータビジョン勉強会@関東 29