Adaptative height

geneit_app/src/widgets/complex_family_tree/ComplexFamilyTree.tsx

@@ -74,14 +74,17 @@ export function ComplexFamilyTree(p: {
   };
 
   const exportPDF = async () => {
+    const docHeight = treeHeight(p.tree) * 41;
+
     const doc = new jsPDF({
       orientation: "l",
-      format: [351, 351],
+      format: [docHeight, 351],
     });
 
     // Clone the SVG to manipulate it
     const container = document.createElement("div");
     container.classList.add("f3", "f3-export");
+    container.style.height = docHeight + "px";
     document.body.appendChild(container);
     applyTree(container);
 
@@ -110,7 +113,7 @@ export function ComplexFamilyTree(p: {
     target.innerHTML = dstSVG;
 
     await doc.svg(target, {
-      height: 351,
+      height: docHeight,
       width: 351,
     });
 
@@ -136,6 +139,21 @@ export function ComplexFamilyTree(p: {
   );
 }
 
+function treeHeight(node: FamilyTreeNode): number {
+  let res =
+    node.down?.reduce((prev, node) => Math.max(prev, treeHeight(node)), 0) ?? 0;
+
+  node.couples?.forEach(
+    (c) =>
+      (res = Math.max(
+        res,
+        c.down.reduce((prev, node) => Math.max(prev, treeHeight(node)), 0)
+      ))
+  );
+
+  return res + 1;
+}
+
 function treeToF3Data(node: FamilyTreeNode, isUp: boolean): f3Data[] {
   const availableMembers = new Set<number>();
   getAvailableMembers(node, availableMembers);

geneit_app/src/widgets/complex_family_tree/family-chart.css

@@ -108,6 +108,5 @@
   /*width: 3508px;
   height: 2480px;*/
   width: 351px;
-  height: 248px;
   opacity: 0;
 }