Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
ツリーマップ: 階層的データ可視化のための推し技術
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
HideyukiKitao
PRO
March 21, 2025
Programming
140
0
Share
ツリーマップ: 階層的データ可視化のための推し技術
私の推し技術ツリーマップについて、
ライブラリ開発の経緯と得られた教訓をお話しします。
1.ライブラリ開発の経緯したお話です。
2.車輪の再発明で得られた栄養分についてお話します。
HideyukiKitao
PRO
March 21, 2025
More Decks by HideyukiKitao
See All by HideyukiKitao
エンジニアの仕事の本質は「正しい名前をつけること」にある。〜レガシー移行プロジェクトで得た「気づき」〜
panda728
PRO
0
28
データベースとアプリケーションの最適な役割分担
panda728
PRO
0
64
「データ」と「ロジック」の幸福な関係
panda728
PRO
0
76
脳の「省エネモード」をデバッグする ~System 1(直感)と System 2(論理)の切り替え~
panda728
PRO
0
180
「コードは上から下へ読むのが一番」と思った時に、思い出してほしい話
panda728
PRO
40
27k
System.IO.Pipelines で utf_ken_all.csv を爆速で読み込む
panda728
PRO
0
110
『HOWはWHY WHATで判断せよ』 〜『ドメイン駆動設計をはじめよう』の読了報告と、本質への探求〜
panda728
PRO
6
2.8k
バッチ処理を「状態の記録」から「事実の記録」へ
panda728
PRO
2
350
Other Decks in Programming
See All in Programming
煩雑なSkills管理をSoC(関心の分離)により解決する――関心を分離し、プロンプトを部品として育てるためのOSSを作った話 / Solving Complex Skills Management Through SoC (Separation of Concerns)
nrslib
3
740
存在論的プログラミング: 時間と存在を記述する
koriym
5
830
CDK Deployのための ”反響定位”
watany
0
410
AI時代の脳疲弊と向き合う ~言語学としてのPHP~
sakuraikotone
1
1.8k
Going Multiplatform with Your Android App (Android Makers 2026)
zsmb
2
350
Migration to Signals, Signal Forms, Resource API, and NgRx Signal Store @Angular Days 03/2026 Munich
manfredsteyer
PRO
0
240
10年分の技術的負債、完済へ ― Claude Code主導のAI駆動開発でスポーツブルを丸ごとリプレイスした話
takuya_houshima
0
1.8k
Codex CLIのSubagentsによる並列API実装 / Parallel API Implementation with Codex CLI Subagents
takatty
2
860
[PHPerKaigi 2026]PHPerKaigi2025の企画CodeGolfが最高すぎて社内で内製して半年運営して得た内製と運営の知見
ikezoemakoto
0
340
感情を設計する
ichimichi
5
1.3k
アーキテクチャモダナイゼーションとは何か
nwiizo
17
4.5k
一度始めたらやめられない開発効率向上術 / Findy あなたのdotfilesを教えて!
k0kubun
4
2.9k
Featured
See All Featured
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
auna
0
110
Jess Joyce - The Pitfalls of Following Frameworks
techseoconnect
PRO
1
130
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
34
2.7k
SEO for Brand Visibility & Recognition
aleyda
0
4.4k
Lessons Learnt from Crawling 1000+ Websites
charlesmeaden
PRO
1
1.2k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
128
55k
Reality Check: Gamification 10 Years Later
codingconduct
0
2.1k
We Analyzed 250 Million AI Search Results: Here's What I Found
joshbly
1
1.1k
Bash Introduction
62gerente
615
210k
Redefining SEO in the New Era of Traffic Generation
szymonslowik
1
270
End of SEO as We Know It (SMX Advanced Version)
ipullrank
3
4.1k
Discover your Explorer Soul
emna__ayadi
2
1.1k
Transcript
ツリーマップ: 階層的データ可視化のた めの推し技術 こんにちは、皆さん。 今日は私の推し技術ツリーマップについて、 ライブラリ開発の経緯と得られた教訓をお話しします。 1.ライブラリ開発の経緯したお話です 2.車輪の再発明で得られた栄養分についてお話します。
自己紹介 北尾 英之 倉庫業務を中心とする物流企業のシステム部所属 リンク X(Twitter): https://x.com/kitaohx GitHub: https://github.com/panda728
ツリーマップ実用例 https://finviz.com/ S&P500 各銘柄やセクターの動きがわかりやすいです 色がつくとヒートマップと呼ばれています。
経緯 現在、COBOL製基幹システムを.NETに移行中! 移行が進むにつれ、売上と原価が見えてきた! 利益を生んでいるのはどこ?をfinviz風に可視化したい! でもC#で階層化やクリックでのズームに対応したライブラリがな い! (補足:finviz風ライブラリはあります。Tableau、Power BIもツリ ーマップに対応してます。)
自宅でC#を使って作ってみました https://github.com/panda728/SquarifiedTreemapLayers 追加ライブラリはDI用にMicrosoft.ExtensionsとSystem.Text.Json BlazorやSkiaSharp対応は今後(現時点ではWinForm、Console)
事例1 地区別部門別売上原価率 売上高を面積、売上原価率を色で表現し、目標未達部分は赤! 平均では埋もれてしまうバラツキが見えるようになった!
特徴 効率的なレイアウト生成と柔軟なカスタマイズ性を提供します。
事例2 人口統計 令和2年国勢調査(総務省統計局) 都道府県・市区町村別の主な結 果 https://www.stat.go.jp
(副題)車輪の再発明で得られた栄養分 インターフェースとSOLID原則の理解が深まった 描画処理の実装は未経験でクラス構造に苦労した。 SOLID原則を見てもよくわからない。 インターフェースにしたら読みやすくなります...ってどゆこと? AIさん助けて!
SOLID原則、完全に理解した(LV1) SOLID原則は「読みやすいコード」のためにある! 開発現場でSOLID原則を適用すべき場面が、すごくわかりやすい! 結果Github Copilotさんが書いたクラス図で流れがわかりやすい! 詳細は長くなるため別記事にて SOLID原則やドメイン駆動設計(DDD)を開発現場で実践するため のヒント https://zenn.dev/panda728/articles/b8584b13488a15
結論 車輪の再発明は、知らなかった原理原則に触れるチャンス! AIさんとの協働することで、知識不足の壁は壁でなくなった! ご清聴ありがとうございました。