Initial commit: webtrees full diagram chart module

Interactive SVG family tree visualization using ELK (Sugiyama) for
layout and D3 for rendering. Shows ancestors, descendants, and siblings
in a single diagram with orthogonal bus-line connectors.

Features:
- Bidirectional tree traversal (ancestors + descendants + siblings)
- Generation-aligned layout with post-processing Y-snap
- Person cards with photos, names, dates, and hover bio cards
- "More ancestors" indicator for persons with hidden parents
- Pan/zoom navigation
- Docker dev environment
This commit is contained in:
2026-03-14 18:51:19 +01:00
commit 273e398431
38 changed files with 5232 additions and 0 deletions

View File

@@ -0,0 +1,30 @@
/**
* Full Diagram — entry point.
*
* Reads embedded data from the page and initializes the chart.
*/
import Chart from "./lib/chart.js";
async function init() {
const data = window.fullDiagramData;
const baseUrl = window.fullDiagramBaseUrl;
if (!data || !data.persons) {
console.error("Full Diagram: No tree data found.");
return;
}
try {
const chart = new Chart("#full-diagram-container", data, baseUrl);
await chart.render();
} catch (err) {
console.error("Full Diagram: Render failed", err);
}
}
// Initialize when DOM is ready
if (document.readyState === "loading") {
document.addEventListener("DOMContentLoaded", init);
} else {
init();
}