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
HideyukiKitao
PRO
March 21, 2025
Programming
0
14
ツリーマップ: 階層的データ可視化のための推し技術
私の推し技術ツリーマップについて、
ライブラリ開発の経緯と得られた教訓をお話しします。
1.ライブラリ開発の経緯したお話です。
2.車輪の再発明で得られた栄養分についてお話します。
HideyukiKitao
PRO
March 21, 2025
Tweet
Share
Other Decks in Programming
See All in Programming
Gunma.web #55
tinykitten
0
110
JAWS Days 2025のインフラ
komakichi
1
430
⚪⚪の⚪⚪をSwiftUIで再現す る
u503
0
160
運用しながらリアーキテクチャ
nealle
0
330
아직도 SOLID 를 '글'로만 알고 계신가요?
sh1mj1
0
320
爆速スッキリ! Rspack 移行の成果と道のり - Muddy Web #11
dora1998
0
110
令和トラベルにおけるコンテンツ生成AIアプリケーション開発の実践
ippo012
1
220
RCPと宣言型ポリシーについてのお話し
kokitamura
2
110
体得しよう!RSA暗号の原理と解読
laysakura
3
410
クックパッド検索システム統合/Cookpad Search System Consolidation
giga811
0
240
Go1.24で testing.B.Loopが爆誕
kuro_kurorrr
0
120
Return of the Full-Stack Developer
simas
PRO
1
280
Featured
See All Featured
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
What's in a price? How to price your products and services
michaelherold
244
12k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
46
2.4k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Facilitating Awesome Meetings
lara
53
6.3k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5.3k
Making Projects Easy
brettharned
116
6.1k
Fontdeck: Realign not Redesign
paulrobertlloyd
83
5.4k
Building Adaptive Systems
keathley
40
2.4k
Reflections from 52 weeks, 52 projects
jeffersonlam
349
20k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
29
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さんとの協働することで、知識不足の壁は壁でなくなった! ご清聴ありがとうございました。