Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
ツリーマップ: 階層的データ可視化のための推し技術
Search
HideyukiKitao
PRO
March 21, 2025
Programming
170
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
ツリーマップ: 階層的データ可視化のための推し技術
私の推し技術ツリーマップについて、
ライブラリ開発の経緯と得られた教訓をお話しします。
1.ライブラリ開発の経緯したお話です。
2.車輪の再発明で得られた栄養分についてお話します。
HideyukiKitao
PRO
March 21, 2025
More Decks by HideyukiKitao
See All by HideyukiKitao
UPDATE をやめる — EF Core でマスタをバージョン管理する
panda728
PRO
0
1.3k
【やさしく解説 設計編・中級 #5】足すだけ、のはずだった ~ ボタンひとつの依頼から ~
panda728
PRO
0
42
【やさしく解説 設計編・中級 #6】良いアーキテクチャとは ~ 一本の登り道の、行き先 ~
panda728
PRO
0
260
【やさしく解説 設計編・中級 #4】ルールの寿命と、システムの年輪
panda728
PRO
2
220
【やさしく解説 設計編・中級 #3】形はあっていたのに ~ 形に書けない約束の話 ~
panda728
PRO
0
90
【やさしく解説 設計編・中級 #2】使わないボタンだらけのリモコン ~ となりの変更で、うちのビルドが赤くなる話 ~
panda728
PRO
1
99
【やさしく解説 設計編・中級 #1】一つの車に、運転手は一人 ~ある倉庫システムの事例から~
panda728
PRO
0
270
【やさしく解説 設計編 #4・本編最終回】何があなたの手を動かすのか
panda728
PRO
1
120
【やさしく解説 設計編 #0】DDDのコード、読めるのに分からない人へ
panda728
PRO
2
380
Other Decks in Programming
See All in Programming
AI時代のシニアエンジニアとは
yosuke_furukawa
PRO
15
11k
Coding with AI: How to trust the storyteller (AWS Community Day Adria, Ljubljana 2026)
slobodan
0
140
Augmenting AI with the Power of Jakarta EE
ivargrimstad
0
210
全ての永続トークンを、生まれる前に消し去りたい!
sylph01
3
1.7k
SFCで実現する病院・医療システムの動的組み立て式UI
koukimiura
1
170
baseline으로 마이그레이션, 리팩토링 안전하게 맡기기
fornewid
1
960
AI時代のIaC入門 〜なぜインフラをコードで管理したいのか?〜 / Introduction to IaC in the AI Era
akihisaikeda
6
1.5k
Enforcing Your Architecture with Unit Tests in the AI Era (Swift Connection X)
steliosf
PRO
1
150
作れる、でも消せるか?──安全に「枯らして消す」機能削除術 / Drain, Then Delete
chobishiba
3
1.5k
Zero-Tap Sign-In対応、結局何をすればいいの?
mitohato14
0
1.9k
クラウドゲーミングのパフォーマンス最適化に挑む / Cloud Gaming Performance Tuning
vivion
0
330
Vapor Mode でアクセシビリティは 壊れないか検証した話
fuqda
1
330
Featured
See All Featured
Abbi's Birthday
coloredviolet
4
11k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
minecr
1
470
Imperfection Machines: The Place of Print at Facebook
scottboms
270
14k
Become a Pro
speakerdeck
PRO
31
6.4k
What the history of the web can teach us about the future of AI
inesmontani
PRO
3
800
Rebuilding a faster, lazier Slack
samanthasiow
85
9.7k
Utilizing Notion as your number one productivity tool
mfonobong
4
640
Fantastic passwords and where to find them - at NoRuKo
philnash
53
4k
How Fast Is Fast Enough? [PerfNow 2025]
tammyeverts
3
970
Bootstrapping a Software Product
garrettdimon
PRO
306
120k
Navigating Weather and Climate Data
rabernat
0
590
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
signer
PRO
0
3.8k
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さんとの協働することで、知識不足の壁は壁でなくなった! ご清聴ありがとうございました。