D3.jsによるデータ可視化：30のチャート全実装ショーケース

D3.jsの強みである「データ駆動のインタラクション」を最大限に活かし、モダンなカラーパレットと洗練されたアニメーション・ツールチップを備えた30種類のチャートを徹底的に実装しました。

すべてのグラフに対してマウスホバーによる詳細表示（ツールチップ）やハイライト効果、ドラッグ操作などを組み込んでいます。ぜひ各チャートを触って、滑らかな挙動を体感してください。

階層・構造データの可視化

1. ツリーダイアグラム (Tree Diagram)

2. デンドログラム (Dendrogram)

3. サークルパッキング (Circle Packing)

4. サンバーストチャート (Sunburst Chart)

5. ツリーマップ (Treemap)

6. 氷柱グラフ (Icicle Chart)

関係性・ネットワークの可視化

7. フォースディレクテッドグラフ (Force-Directed Graph)

8. サンキーダイアグラム (Sankey Diagram)

9. コードダイアグラム (Chord Diagram)

10. アークダイアグラム (Arc Diagram)

11. ハイブプロット (Hive Plot)

12. マトリクス図 (Matrix/Adjacency Matrix)

地理・空間データの可視化

13. コロプレスマップ (Choropleth Map)

14. バブルマップ (Bubble Map)

15. ヘックスビンマップ (Hexbin Map)

16. 等値線マップ (Isoline/Contour Map)

17. カートグラム (Cartogram / Dorling)

18. 地球儀プロット (Orthographic Projection)

※地球儀はマウスドラッグで回転させることができます。

時系列・分布データの可視化

19. ストリームグラフ (Streamgraph)

20. リッジラインプロット (Ridgeline Plot / Joyplot)

21. カレンダーヒートマップ (Calendar Heatmap)

22. ガントチャート (Gantt Chart)

23. スロープグラフ (Slopegraph)

24. バイオリンプロット (Violin Plot)

比較・統計データの可視化

25. パラレルコーディネート (Parallel Coordinates)

26. レーダーチャート (Radar Chart)

27. ドットプロット (Dot Plot)

28. ウォーターフォールチャート (Waterfall Chart)

29. ブレットグラフ (Bullet Graph)

30. ワードクラウド (Word Cloud)