@figtreejs/core 0.0.1-beta.0 → 0.1.0-beta.2

package/src/layouts/functional/radial-layout.ts

@@ -1,5 +1,3 @@
-// export function layout (tree:ImmutableTree,node?:NodeRef):Map<NodeRef,FunctionalVertex>{
-
 import type { ImmutableTree, NodeRef } from "../../evo";
 import { preOrderIterator, tipIterator } from "../../evo";
 import type { NodeLabelType } from "../types";
@@ -18,6 +16,13 @@ type data = {
   number: number;
 };
 
+/**
+ * The radial (unrooted) layout
+ * @param tree
+ * @param options  {spread: number} - increases this increases the space between tips
+ * @returns (node)=>FunctionalVertex
+ */
+
 export function radialLayout(
   tree: ImmutableTree,
   options: { spread?: number } = {},
@@ -59,21 +64,20 @@ export function radialLayout(
       dx = Math.cos(branchAngle);
       dy = Math.sin(branchAngle);
     }
+
+    const nTheta = normalizeAngle(branchAngle);
     const vertex = {
       x,
       y,
       layoutClass: layoutClass.Radial,
-      theta: branchAngle,
+      theta: nTheta,
       nodeLabel: {
         dxFactor: dx,
         dyFactor: dy,
         alignmentBaseline: "middle",
         textAnchor:
-          normalizeAngle(branchAngle) > Math.PI / 2 &&
-          normalizeAngle(branchAngle) < (3 * Math.PI) / 2
-            ? "end"
-            : "start",
-        rotation: 0, // textSafeDegrees(normalizeAngle(branchAngle))
+          nTheta > Math.PI / 2 && nTheta < (3 * Math.PI) / 2 ? "end" : " start",
+        rotation: textSafeDegrees(nTheta) * 2, // why is this magic 2 needed?
       } as NodeLabelType,
     };
 
@@ -130,9 +134,9 @@ export function textSafeDegrees(radians: number) {
   //trial and error  - must be a better way
   if (d > 90 && d < 270) {
     return (d - 180) / 2;
-  } else if (d > 0 && d < 88) {
+  } else if (d > 0 && d < 90) {
     return d / 2;
-  } else if (d < 360 && d > 272) {
+  } else if (d < 360 && d > 270) {
     return (360 + d) / 2;
   } else {
     return d;

package/src/layouts/functional/rectangular-layout.ts

@@ -5,6 +5,13 @@ import type { NodeLabelType, FunctionalVertex } from "../types";
 import { layoutClass } from "../types";
 import { unNullify } from "../../utils/maybe";
 
+/**
+ * This is the base class for layouts that place the parent nodes at the mean of their children.
+ * It forms the basis of the polar and rectangular layouts.
+ * The difference between the two is handled by the scaling functions.
+ * @param lc - layoutClass rectangular / polar
+ * @returns
+ */
 export function baseLayout(lc: layoutClass) {
   function layout(tree: ImmutableTree): (node: NodeRef) => FunctionalVertex {
     const map = new Map<NodeRef, FunctionalVertex>();

package/src/layouts/layout-interface.ts

@@ -1,76 +1,3 @@
-import type { layoutOptions } from "../components/figtree/figtree-types";
-//TODO make tree
-
-// TODO caching
-
-//
-export interface Label {
-  x: number;
-  y: number;
-  alignmentBaseline: string;
-  textAnchor: string;
-  rotation: number;
-  alignedPos?: { x: number; y: number };
-}
-export interface Vertex {
-  number: number;
-  x: number;
-  y: number;
-  hidden: boolean | undefined;
-  labelHidden: boolean | undefined;
-  level: number;
-  branch?: {
-    d: string;
-    label: Label;
-  };
-  theta?: number; //angle
-  r?: number; //radius
-  nodeLabel: Label;
-}
-
-export interface ArbitraryVertex {
-  hidden: boolean;
-  labelHidden: boolean;
-  number: number;
-  x: number;
-  y: number;
-  level: number;
-  theta?: number; //angle
-  pathPoints: { x: number; y: number }[];
-  nodeLabel: {
-    dx: number;
-    dy: number;
-    alignmentBaseline: string;
-    textAnchor: string;
-    rotation?: number;
-  };
-}
-
-//ids match node ids
-export interface Vertices {
-  type: "Rectangular" | "Polar" | "Radial";
-  vertices: Vertex[];
-  origin?: { x: number; y: number }; // used by polar layout to denote the position of the root (or stem) which can change
-  theta?: [number, number]; // used by polar layout to denote the range of angles
-  axisLength?: number; // provided by layouts that support axis
-}
-
-export interface ArbitraryVertices {
-  vertices: ArbitraryVertex[];
-  extent: { x: [number, number]; y: [number, number] };
-}
-
-export interface internalLayoutOptions extends layoutOptions {
-  // all layout options plus width and height of drawable area
-  width?: number;
-  height?: number;
-}
-
-export interface CartoonData {
-  cartooned: boolean;
-  collapseFactor: number;
-}
-
 export const defaultInternalLayoutOptions = {
   width: 1000,
   height: 1000,

package/src/tests/baubles/__snapshots__/node-labels.test.tsx.snap

@@ -671,7 +671,7 @@ exports[`Node labels > renders a tree node labels in radial layout 1`] = `
                 <text
                   alignment-baseline="middle"
                   text-anchor="end"
-                  transform="translate(148.99984767296695,89.72852388058958) rotate(0)"
+                  transform="translate(148.99984767296695,89.72852388058958) rotate(59.99999999999997)"
                 >
                   Label!
                 </text>
@@ -685,8 +685,8 @@ exports[`Node labels > renders a tree node labels in radial layout 1`] = `
               <g>
                 <text
                   alignment-baseline="middle"
-                  text-anchor="start"
-                  transform="translate(231.24985501012264,-5.190660633322136) rotate(0)"
+                  text-anchor=" start"
+                  transform="translate(231.24985501012264,-5.190660633322136) rotate(660.1047197551197)"
                 >
                   Label!
                 </text>
@@ -701,7 +701,7 @@ exports[`Node labels > renders a tree node labels in radial layout 1`] = `
                 <text
                   alignment-baseline="middle"
                   text-anchor="end"
-                  transform="translate(-5.999989978491366,95.13618828386687) rotate(0)"
+                  transform="translate(-5.999989978491366,95.13618828386687) rotate(-0.10471975511964615)"
                 >
                   Label!
                 </text>
@@ -715,8 +715,8 @@ exports[`Node labels > renders a tree node labels in radial layout 1`] = `
               <g>
                 <text
                   alignment-baseline="middle"
-                  text-anchor="start"
-                  transform="translate(383,385.19615242270663) rotate(0)"
+                  text-anchor=" start"
+                  transform="translate(383,385.19615242270663) rotate(59.99999999999999)"
                 >
                   Label!
                 </text>
@@ -794,7 +794,7 @@ exports[`Node labels > renders a tree node labels in radial layout 1`] = `
               <text
                 alignment-baseline="middle"
                 text-anchor="end"
-                transform="translate(148.99984767296695,89.72852388058958) rotate(0)"
+                transform="translate(148.99984767296695,89.72852388058958) rotate(59.99999999999997)"
               >
                 Label!
               </text>
@@ -808,8 +808,8 @@ exports[`Node labels > renders a tree node labels in radial layout 1`] = `
             <g>
               <text
                 alignment-baseline="middle"
-                text-anchor="start"
-                transform="translate(231.24985501012264,-5.190660633322136) rotate(0)"
+                text-anchor=" start"
+                transform="translate(231.24985501012264,-5.190660633322136) rotate(660.1047197551197)"
               >
                 Label!
               </text>
@@ -824,7 +824,7 @@ exports[`Node labels > renders a tree node labels in radial layout 1`] = `
               <text
                 alignment-baseline="middle"
                 text-anchor="end"
-                transform="translate(-5.999989978491366,95.13618828386687) rotate(0)"
+                transform="translate(-5.999989978491366,95.13618828386687) rotate(-0.10471975511964615)"
               >
                 Label!
               </text>
@@ -838,8 +838,8 @@ exports[`Node labels > renders a tree node labels in radial layout 1`] = `
             <g>
               <text
                 alignment-baseline="middle"
-                text-anchor="start"
-                transform="translate(383,385.19615242270663) rotate(0)"
+                text-anchor=" start"
+                transform="translate(383,385.19615242270663) rotate(59.99999999999999)"
               >
                 Label!
               </text>