Mohamed BardouniAI Expert & Product Engineer

Rijal Al-Hadith 3D Atlas: Exploring Classical Narrator Chains in Three.js

An interactive Arabic 3D WebGL knowledge atlas visualizing classical narrator generations ('tabaqat'), teacher-student transmission chains ('isnad'), and geographical distribution.

Three.jsTypeScriptViteArabic Visualization
Rijal Al-Hadith 3D Atlas: Exploring Classical Narrator Chains in Three.js

Context

Classical biographical dictionaries ('Ilm al-Rijal') record thousands of interconnected scholars across centuries and cities. Reading them as flat text makes it hard to grasp generational clustering and transmission topologies at a glance.

Scope I disclose publicly

  • A 3D generational graph layout positioning scholars by century ('tabaqa'), scholarly rank, and region.
  • Interactive lineage tracing that illuminates direct teacher and student chains whenever a narrator node is selected.
  • An Arabic RTL heads-up interface providing instant search, filtering, biographical inspection cards, and smooth camera fly-to transitions.

Decisions and trade-offs

  • Mapping generational strata ('tabaqat') along a dedicated spatial axis so chronological flow remains readable even in dense clusters.
  • Rendering Arabic node labels via crisp canvas textures to preserve complex Arabic ligatures at 60 FPS in WebGL.
  • The trade-off: keeping browser frame rates smooth requires curating structured graph subsets rather than dumping raw multi-volume corpora into GPU memory.

The live 3D atlas can be explored directly at mbardouni.dev/rijalHadith/.

Check the public source
Disclosure: This is an educational and visual engineering project.

Need something similar?

Send me the problem, the users, and the expected scope.