archaeopteryx 3.14.0 → 3.15.0

package/README.md

@@ -257,8 +257,10 @@ the mouse wheel zooms too, and never rotates), **X− / X+ become rotate** (a
 direction** flip — labels riding their spokes or standing upright — while
 vertical expansion greys out. **Fit** centres and scales the fan; **Esc**
 also resets rotation and label direction. Unrooted
-additionally greys out the aligned-phylogram option and Auto-hide Labels
-(there is no common label edge, and no even row spacing to hide against).
+additionally greys out the aligned-phylogram option (there is no common label
+edge). Auto-hide Labels stays live: the tip-label thinning it governs needs
+even row spacing and so does nothing in unrooted, but the crowded-branch-data
+rule it also governs applies in every layout.
 
 ## Rooting
 
@@ -526,6 +528,16 @@ section holds the controls:
   the tree), or `None`.
 * **Glow** — a soft glow in each domain's own colour around its box.
 
+**Hovering a domain** reads it out: the domain's name, its E-value (small
+ones keep their exponent, 7.20e-117), the residues it spans with its own length and the protein's,
+the tree tip it belongs to, and its accession where the file carries one.
+**Clicking the box** looks the domain up: straight to the Pfam entry when
+there is an accession, and an InterPro search by name when there is not —
+phyloXML's domain `id` is optional, and a file with names alone (our own
+`apaf.xml` among them) cannot address an entry, since InterPro resolves
+accessions and not Pfam identifiers. Only the domain boxes take the mouse, so
+the tree behind the track stays clickable.
+
 In the circular and unrooted layouts the tracks ride each tip's spoke
 outward and carry no names (the legend still works); they need radial
 labels, which switching layouts turns on. A malformed domain — a missing or
@@ -555,7 +567,7 @@ To find a motif, pick **Molecular Sequence** in a search box: it matches the
 residues as written, gap characters included, as the desktop does.
 
 **Sequence Logo** (the checkbox under **Alignment**) replaces the conservation
-bar with a **logo**: every column a stack of letters, as tall as that column's
+bar with a **logo**: a stack of letters per column, as tall as that column's
 information content in bits and shared out by residue frequency, most frequent
 on top — the display the MEME Suite and WebLogo draw. A conserved column is one
 tall letter, a variable one a short pile, and the caption gives the scale
@@ -566,7 +578,8 @@ clade's motif rather than the file's, and the caption names how many tips that
 is (`n = 12`). Two consequences worth knowing: gaps are not a letter —
 frequencies are taken over the residues present, and the stack is then scaled
 by the column's occupancy, so a column held up by two sequences out of fifty
-draws short rather than perfectly conserved; and there is **no small-sample
+draws short rather than perfectly conserved and an all-gap column draws
+nothing; and there is **no small-sample
 correction**, because entering a three-tip clade is a normal thing to do and
 Schneider's correction would subtract more than the maximum and leave the
 column blank. Read `n` and judge.
@@ -1040,11 +1053,13 @@ each with a checkbox under Display Data to turn it off.
 Support and branch-length values draw **2 px smaller than the label font**
 (never below 6 px), as on the desktop, so they annotate without competing.
 And besides the numeric display there are **Support Dots**: a filled dot at
-the midpoint of every branch whose support is at least 95% (`supportDotMinimum`;
+the midpoint of a branch whose support is at least 95% (`supportDotMinimum`;
 posterior- and bootstrap-scaled trees are told apart automatically). The dot
 is always a fixed amount wider than the branch itself, so it tracks the
 Branch Width slider instead of sitting at one fixed size. A branch drawn
-shorter than the dot itself stays clean.
+shorter than the dot itself stays clean, and so does one whose dot would land
+on a dot already drawn — see the crowding rule below, which is what decides
+between them rather than either one being shrunk.
 
 The **control panel itself** follows the same idea. It opens showing the
 sections that describe the tree — what it can be coloured by, what it shows —
@@ -1090,6 +1105,37 @@ It describes what is on screen, so inside a subtree it describes the subtree
 and says so, and it is recomputed each time it opens rather than cached (24 ms
 on the 13,246-tip demo). There is no histogram.
 
+**Auto-hide Labels** also thins out **crowded branch data**. Support values,
+branch-length values and support symbols are drawn only where they fit: each
+mark claims the box it is about to occupy, and one that would overlap a box
+already claimed in that pass is left out. The claim order is the tree's own,
+root first, so the mark nearer the root keeps its place and the same tree at
+the same size always drops the same marks — on screen and in every export.
+Numbers and symbols are kept in separate maps, since the symbol sits on the
+branch and the numbers just above and below it. Symbols are never shrunk to
+fit: where a symbol's size means something, a smaller one would report
+something else. Switch the toggle off and everything is drawn. Zero needs no
+special case — a lone zero-length branch overlaps nothing, so its number
+stays. Branch events take part too. This is the desktop Archaeopteryx's rule,
+adopted so the two programs thin the same tree the same way; the marks they
+drop are close but not identical, because the boxes come from each program's
+own font metrics.
+
+It applies in **all three layouts**. In the circular and unrooted views a mark
+rides its branch: it is drawn at the branch's midpoint, turned to the branch's
+direction and set just off the line, so the box claimed for it is the
+axis-aligned bounds of that turned rectangle, centred where the text's own
+centre lands — the desktop's formula, which carries over because both programs
+measure it in real screen space rather than in the layout's own units. A
+diagonal label's bounds are wider than its ink, so a crowded number is dropped
+rather than overprinted. The circular view of `flu_h5.xml` goes from 785 drawn
+numbers, 743 of them overlapping another, to 87 with none.
+
+One placement follows from that: in the two radial views every mark is drawn on
+the same point, the branch's midpoint, so a **branch event** sits a line clear
+of the branch-length value rather than on top of it. In the rectangular layout
+they are already apart along the branch and share the line above it.
+
 A host with little room to give can
 also start the whole panel tighter and narrower with
 [`panelDensity: 'compact'`](#configuration), or collapsed to its header bar
@@ -1128,7 +1174,7 @@ copy-pastable JSON.
 | `layout` | `'rectangular'` | The starting layout: `'rectangular'`, `'circular'`, or `'unrooted'`. |
 | `ladderizeTree` | `true` | Ladderize the tree on load: at each node, the larger clade first (any number of children, so a polytomy sorts too). |
 | `showMsa` | tree-derived | Open with the alignment track shown. Default: on when the tree carries an aligned `mol_seq`, off otherwise — an explicit `true`/`false` overrides that. |
-| `showMsaLogo` | `false` | Open with the alignment summarised as a sequence logo instead of a conservation bar: each column a stack of letters as tall as its information content, over the tips currently on screen. Only drawn while the alignment track is shown. |
+| `showMsaLogo` | `false` | Open with the alignment summarised as a sequence logo instead of a conservation bar: a stack of letters per column, as tall as its information content, over the tips currently on screen. Only drawn while the alignment track is shown. |
 | `showHeatmap` | `false` | Open with the heat map shown. Offered whenever the tree carries two or more numeric per-tip fields, but off unless asked for: almost any annotated tree has such fields, so turning it on by itself would be an opinion about the tree rather than a service. |
 | `heatmapColumnOrder` | tree-derived | How the heat map's columns are ordered: `'document'` (as the file lists them), `'clustered'` (Euclidean), `'clustered-presence'` (Bray–Curtis), `'alphabetical'`, `'frequency'`. The clustered modes also draw the dendrogram. Default: a **clustered** order, with the distance chosen from the values — Bray–Curtis where the matrix has zeros to ignore and nothing negative, Euclidean otherwise. An explicit value always wins and is never re-derived. |
 | `heatmapManualOrder` | `null` | The heat map's columns in your own order, as an array of property refs (`['meta:recA', 'meta:gyrA', …]`). Only read while `heatmapColumnOrder` is `'manual'`. A ref the tree has not got is ignored, and a column the list does not name follows the ones it does. |

package/archaeopteryx.js

@@ -20,7 +20,7 @@
  *
  */
 
-// v 3.14.0
+// v 3.15.0
 // 2026-09-17
 //
 // Archaeopteryx.js is a software tool for the visualization and
@@ -103,7 +103,7 @@ function (root, d3, forester, phyloXml) {
     // IIFE's own function name -- a plain object says what it is.)
     let archaeopteryx = {};
 
-    const VERSION = '3.14.0';
+    const VERSION = '3.15.0';
     const WEBSITE = 'https://cmzmasek.github.io/archaeopteryx-js/';
     const DESKTOP_WEBSITE = 'https://cmzmasek.github.io/archaeopteryx/';
     const SOURCE_WEBSITE = 'https://github.com/cmzmasek/archaeopteryx-js';
@@ -1481,6 +1481,26 @@ function (root, d3, forester, phyloXml) {
     // so the guess was what the reader saw every time.
     const HOVER_READOUT_GAP = 14;
 
+    // One way to open an external page. There were three: window.open + a
+    // win.focus() that throws when a popup blocker hands back null and which
+    // passed no noopener, an <a target="_blank" rel="noopener noreferrer">,
+    // and a third for the domain link. Three security postures for one job,
+    // and a change to the policy would have had to find all of them.
+    //
+    // noopener: the opened page must not get a handle on this window.
+    // noreferrer with it, since a tree can come from anywhere and its URL is
+    // not the external site's business.
+    function openExternal(url) {
+        if (!url) {
+            return null;
+        }
+        let win = window.open(url, '_blank', 'noopener,noreferrer');
+        if (win) {
+            win.focus();   // a blocked popup hands back null; that is not an error
+        }
+        return win;
+    }
+
     function placeHoverReadout(el, event) {
         let w = el.offsetWidth;
         let h = el.offsetHeight;
@@ -2319,12 +2339,23 @@ function (root, d3, forester, phyloXml) {
 
     let _legendMeasureCtx = null;
 
-    function legendTextWidth(text, font) {
+    // One lazily made canvas for every text measurement: the legend's widths,
+    // the branch-data line metrics and the sequence logo's glyph boxes each
+    // used to make their own.
+    function measureCtx() {
         if (!_legendMeasureCtx) {
             _legendMeasureCtx = document.createElement('canvas').getContext('2d');
         }
-        _legendMeasureCtx.font = font;
-        return _legendMeasureCtx.measureText(text).width;
+        return _legendMeasureCtx;
+    }
+
+    function legendTextWidth(text, font) {
+        let ctx = measureCtx();
+        if (!ctx) {
+            return 0;
+        }
+        ctx.font = font;
+        return ctx.measureText(text).width;
     }
 
     // The card's row order and cap, the desktop's way: rank by count first
@@ -3178,7 +3209,11 @@ function (root, d3, forester, phyloXml) {
             .attr('transform', function (d) {
                 return radialDisplay() ? branchLabelTransform(d) : null;
             })
-            .attr('dy', '-.25em')
+            // Every one of these three reads its offset from branchMarkPlacement,
+            // the same function the occupancy boxes are built from: a box that is
+            // not where the text is hides the wrong marks, and two copies of the
+            // same number drift apart the first time one of them is edited.
+            .attr('dy', branchMarkPlacement('bl', _state.branchDataFontSize).dy)
             .attr('x', function (d) {
                 if (radialDisplay()) {
                     return 0;
@@ -3199,7 +3234,7 @@ function (root, d3, forester, phyloXml) {
             .attr('transform', function (d) {
                 return radialDisplay() ? branchLabelTransform(d) : null;
             })
-            .attr('dy', _state.branchDataFontSize)
+            .attr('dy', branchMarkPlacement('conf', _state.branchDataFontSize).dy)
             .attr('x', function (d) {
                 if (radialDisplay()) {
                     return 0;
@@ -3235,7 +3270,7 @@ function (root, d3, forester, phyloXml) {
             .attr('transform', function (d) {
                 return radialDisplay() ? branchLabelTransform(d) : null;
             })
-            .attr('dy', '-.25em')
+            .attr('dy', branchMarkPlacement('event', _state.branchDataFontSize).dy)
             .attr('x', function (d) {
                 if (radialDisplay()) {
                     return 0;
@@ -3820,6 +3855,169 @@ function (root, d3, forester, phyloXml) {
     // a support dot. Returns the nodes that need a <g> -- those with any of
     // them, and every collapsed clade (its wedge and label). The rest are
     // drawn entirely by drawTreeGeometry's batched paths.
+    // ===================== Crowded branch data =====================
+    // A branch-anchored mark is drawn only when its box does not overlap one
+    // already granted in the same pass. Ported from the desktop's
+    // LabelOccupancy (0.11.161) as a JOINT rule on Christian's word,
+    // 2026-09-25: "match the desktop's new auto-hide rule for crowded branch
+    // data". Neither side retunes it alone.
+    //
+    // It exists because the obvious rule does not work. The desktop built
+    // "hide when the branch is drawn shorter than the text" first and measured
+    // it: on an 825-tip tree a third-of-text threshold hid 285 numbers of
+    // which only 51 collided, and still left 22 pile-ups. A number is
+    // unreadable when it overlaps ANOTHER number, which depends on closeness
+    // in y as much as in x, and branch length only sees x. Measured here
+    // before adopting it: with Auto-hide Labels already ON, 240 of 267 drawn
+    // support numbers overlapped another on flu_h5.xml (90%), 149 of 262 on
+    // Adenoviridae, 13 of 119 on bcl2 -- our auto-hide decimates TIP labels
+    // and had never touched branch data.
+    //
+    // WHAT MUST MATCH, or the two viewers drop different marks:
+    //  - the tie-break: PREORDER, first claim wins, so the mark nearer the
+    //    root keeps its place. d3's descendants() is preorder already.
+    //  - TWO maps, numbers and symbols. The symbol sits ON the branch and the
+    //    numbers just above and below it, so one shared map would let a
+    //    branch's own symbol block its own numbers.
+    //  - a refused claim records NOTHING, so a rejected mark never blocks a
+    //    later one.
+    //  - a zero-size box is granted and not recorded.
+    //  - symbols are never shrunk to fit: in a size-scaled mode the diameter
+    //    IS the support, and a smaller dot would report weaker support.
+    //
+    // WHAT CANNOT MATCH, and is not meant to: the COUNTS. The boxes come from
+    // each program's own font metrics, so the same tree at the same size drops
+    // a similar but not identical set. The rule is the contract; the tally is
+    // not.
+    //
+    // Where a branch-anchored mark sits, in the tree group's coordinates.
+    // Mirrors the placement in syncOptionalNodeChildren exactly -- the branch
+    // length back toward the parent and above the branch, the confidence at
+    // the branch midpoint and below it -- because a box that is not where the
+    // text is would hide the wrong marks.
+    // The font's LINE box, which is what the marks are laid out with and what
+    // the desktop measures too (FontMetrics.getHeight()). Not the per-glyph
+    // ink box: two numbers collide when their lines overlap, and ink boxes
+    // would let "1" slide under "0.81".
+    //
+    // Measured from the font rather than assumed. The fallback is what this
+    // font actually reports at 9px -- ascent 9, descent 2, line 11 -- read off
+    // a rendered label's getBBox rather than guessed.
+    let _branchFontCache = null;
+
+    function branchFontMetrics(fontPx) {
+        if (_branchFontCache && _branchFontCache.px === fontPx) {
+            return _branchFontCache;
+        }
+        let ctx = measureCtx();
+        ctx.font = fontPx + 'px ' + FONT_DEFAULTS;
+        let m = ctx.measureText('0');
+        let ascent = m.fontBoundingBoxAscent;
+        let descent = m.fontBoundingBoxDescent;
+        // Both, separately: a canvas that reports an ascent and no descent
+        // would give height = ascent + undefined = NaN, every box would be
+        // refused a claim as zero-sized, and the feature would turn itself off
+        // with no error and a green suite.
+        if (!(ascent > 0)) {
+            ascent = fontPx;
+        }
+        if (!(descent >= 0)) {
+            descent = fontPx * (2 / 9);
+        }
+        _branchFontCache = {px: fontPx, ascent: ascent, descent: descent,
+            height: ascent + descent};
+        return _branchFontCache;
+    }
+
+    // Where a branch mark sits on its branch, read off the rendered elements
+    // rather than inferred: the horizontal anchor and the `dy` the element is
+    // drawn with. Getting either wrong is not a rounding error. A
+    // middle-anchored box modelled as left-anchored is half its own width out,
+    // which once let 44% of the granted numbers still overlap; and a branch
+    // EVENT sits a quarter em ABOVE the line like the branch length, not a
+    // font size below it like the confidence, so modelling it as a confidence
+    // put its box on the wrong side of the branch -- the one side it could
+    // never collide on.
+    function branchMarkPlacement(kind, fontPx) {
+        if (kind === 'conf') {
+            return {mid: true, dy: fontPx};
+        }
+        if (kind === 'event') {
+            // A radial layout draws every mark on ONE point, the branch's
+            // midpoint, so a branch event and a branch length -- both a quarter
+            // em above the line -- printed straight through each other. The
+            // event is lifted a whole line clear of the length. The rectangular
+            // layout already separates them along the branch (the length at the
+            // parent end, the event at the middle), so there they share a line.
+            return {mid: true, dy: radialDisplay()
+                ? ((-0.25 * fontPx) - branchFontMetrics(fontPx).height)
+                : (-0.25 * fontPx)};
+        }
+        return {mid: false, dy: -0.25 * fontPx};   // 'bl': start-anchored, a quarter em up
+    }
+
+    // The incoming branch's MIDPOINT and screen direction, in the tree group's
+    // own coordinates -- what a radial mark is actually drawn on, since
+    // branchLabelTransform rotates to the spoke and translates half a branch
+    // back along it. Circular: the leg runs along ONE spoke, so the midpoint is
+    // the mean of the two radii at the same angle (an arc's chord is not on the
+    // leg). Unrooted: the branch is a straight line, so it is the mean of the
+    // two points. Both match the desktop's two call sites of
+    // paintBranchDataRadial.
+    function radialBranchMid(d) {
+        let angle = spokeAngle(d);
+        if (_state.unrootedDisplay) {
+            if (d.ux === undefined) {
+                return null;
+            }
+            let p = (d.parent && d.parent.ux !== undefined) ? d.parent : null;
+            return p ? [0.5 * (d.ux + p.ux), 0.5 * (d.uy + p.uy), angle] : [d.ux, d.uy, angle];
+        }
+        let r = radialRadius(d.y);
+        if (d.parent) {
+            r = 0.5 * (r + radialRadius(d.parent.y));
+        }
+        let pt = polarXY(radialAngle(d.x), r);
+        return [pt[0], pt[1], angle];
+    }
+
+    function branchMarkBox(d, kind, text, fontPx) {
+        let w = legendTextWidth(text, fontPx + 'px ' + FONT_DEFAULTS);
+        let fm = branchFontMetrics(fontPx);
+        let h = fm.height;
+        let at = branchMarkPlacement(kind, fontPx);
+        if (radialDisplay()) {
+            // The mark rides the branch, so its box is the AXIS-ALIGNED bounds
+            // of the rotated rectangle, centred where the text's own centre
+            // lands: forester.rotatedLabelBox, which carries the desktop's
+            // formula and the reasons it is the conservative one.
+            let mid = radialBranchMid(d);
+            if (!mid) {
+                return null;
+            }
+            // `dy` shifts the BASELINE, so the box's centre sits half a line
+            // below it; and the 180-degree flip that keeps the far half of the
+            // fan upright carries this perpendicular offset with it.
+            let off = at.dy + (0.5 * (fm.descent - fm.ascent));
+            if (labelFlip(d)) {
+                off = -off;
+            }
+            // every radial mark is middle-anchored at x=0, so only the
+            // perpendicular offset moves its centre off the branch midpoint
+            return forester.rotatedLabelBox(mid[0] - (Math.sin(mid[2]) * off),
+                mid[1] + (Math.cos(mid[2]) * off), w, h, mid[2]);
+        }
+        // The ROOT's numbers are drawn too, at x=0 in its own group, and they
+        // used to claim nothing -- so the first child's number, landing in
+        // almost the same place, was granted and painted over them. The one
+        // place the pass could not keep its promise.
+        let span = d.parent ? (d.parent.y - d.y) : 0;
+        let x = at.mid
+            ? (d.y + (0.5 * span) - (w / 2))          // middle-anchored
+            : (d.y + span + 1);                       // start-anchored
+        return [x, (d.x + at.dy) - fm.ascent, w, h];
+    }
+
     function prepareNodeDrawing(nodes) {
         let wantBl = _state.showBranchLengthValues === true;
         let wantConf = _state.showConfidenceValues === true || _state.showMadValues === true;
@@ -3841,6 +4039,14 @@ function (root, d3, forester, phyloXml) {
             d._confText = wantConf ? asText(makeConfidenceValuesLabel(d)) : '';
             d._eventText = wantEvent ? asText(makeBranchEventsLabel(d)) : '';
             d._suppDot = wantDot && showSupportDot(d);
+        }
+        // Before `drawn` is built, not after: a refused mark used to leave a
+        // childless <g class="node"> behind, and those are transformed on
+        // every animation frame. On the big tree that was ~18,000 empty groups
+        // per redraw, defeating the very thing the `drawn` filter is for.
+        hideCrowdedBranchData(nodes);
+        for (let i = 0, len = nodes.length; i !== len; ++i) {
+            let d = nodes[i];
             if (d._extLabelText !== '' || d._blText !== '' || d._confText !== ''
                 || d._eventText !== '' || d._suppDot || isCollapsed(d)) {
                 drawn.push(d);
@@ -3849,6 +4055,88 @@ function (root, d3, forester, phyloXml) {
         return drawn;
     }
 
+    // The occupancy pass, in PREORDER -- so the mark nearer the root claims
+    // its space first and keeps it. NOT the order the layout hands out: d3's
+    // descendants() is breadth-first and the viewer reverses it for drawing,
+    // which puts the root LAST and inverts the entire tie-break. That shipped,
+    // and a review caught it; forester.preorderOf derives the right order from
+    // the nodes themselves.
+    //
+    // Runs before anything is drawn, so the decision cannot depend on the
+    // order the DOM happens to be updated in.
+    //
+    // Rides the existing Auto-hide Labels toggle: switch it off and everything
+    // is drawn. Runs in ALL THREE layouts, as the desktop does -- the boxes are
+    // built in the tree group's own coordinates, which is where every mark is
+    // actually drawn, so the circular and unrooted views are measured in their
+    // own space and not in the cluster's. (The tip-label decimation that shares
+    // the toggle is still skipped in unrooted: that one needs even row spacing
+    // to decimate against, and there is none.)
+    function hideCrowdedBranchData(nodes) {
+        if (!_state.dynahide) {
+            return;
+        }
+        // No layout state, no honest boxes. Bailing out draws everything; going
+        // on would put every mark at the origin, where they all overlap and all
+        // but the first would be hidden -- a blank tree, with no error.
+        if ((_state.circularDisplay && !_radial) || (_state.unrootedDisplay && !_unroot)) {
+            return;
+        }
+        let fontPx = _state.branchDataFontSize;
+        let dotCell = 0;
+        for (let i = 0; i < nodes.length; ++i) {
+            if (nodes[i]._suppDot) {
+                dotCell = Math.max(dotCell, 2 * supportDotRadius(nodes[i]));
+            }
+        }
+        let cell = Math.max(fontPx, dotCell);
+        let numbers = forester.labelOccupancy(cell);
+        let symbols = forester.labelOccupancy(cell);
+        let ordered = forester.preorderOf(nodes);
+        for (let i = 0, len = ordered.length; i !== len; ++i) {
+            let d = ordered[i];
+            // Branch length first, then confidence: they sit on opposite sides
+            // of the branch, so they rarely contend, but the order decides
+            // which survives when they do.
+            if (d._blText !== '') {
+                let b = branchMarkBox(d, 'bl', d._blText, fontPx);
+                if (b && !numbers.claim(b[0], b[1], b[2], b[3])) {
+                    d._blText = '';
+                }
+            }
+            if (d._confText !== '') {
+                let b = branchMarkBox(d, 'conf', d._confText, fontPx);
+                if (b && !numbers.claim(b[0], b[1], b[2], b[3])) {
+                    d._confText = '';
+                }
+            }
+            // Branch EVENTS are branch-anchored too, half a branch from the
+            // branch length and on the same side of it, so they can land on
+            // the same pixels. Left out of the map, they neither refused a
+            // number nor were refused by one, and the pass reported "no
+            // overlapping marks" while the user could see two.
+            if (d._eventText !== '') {
+                let b = branchMarkBox(d, 'event', d._eventText, fontPx);
+                if (b && !numbers.claim(b[0], b[1], b[2], b[3])) {
+                    d._eventText = '';
+                }
+            }
+            if (d._suppDot) {
+                // never shrunk to fit: in a size-scaled mode the diameter IS
+                // the support value, and a smaller dot reports weaker support
+                let r = supportDotRadius(d);
+                // showSupportDot already required a parent; a circle's bounds
+                // do not rotate, so the radial case needs only the midpoint
+                let at = radialDisplay()
+                    ? radialBranchMid(d)
+                    : [d.y + (0.5 * (d.parent.y - d.y)), d.x];
+                if (at && !symbols.claim(at[0] - r, at[1] - r, 2 * r, 2 * r)) {
+                    d._suppDot = false;
+                }
+            }
+        }
+    }
+
     function syncOptionalNodeChildren(node) {
         let wantBl = _state.showBranchLengthValues === true;
         let wantConf = _state.showConfidenceValues === true || _state.showMadValues === true;
@@ -6379,8 +6667,7 @@ function (root, d3, forester, phyloXml) {
                 }
 
                 if (url) {
-                    let win = window.open(url, '_blank');
-                    win.focus();
+                    openExternal(url);
                 } else {
                     // Not a programming error -- the user clicked and there is
                     // simply nowhere to go -- so this one gets told in the same
@@ -6880,11 +7167,9 @@ function (root, d3, forester, phyloXml) {
         if (_logoGlyphs[ch]) {
             return _logoGlyphs[ch];
         }
-        if (!_legendMeasureCtx) {
-            _legendMeasureCtx = document.createElement('canvas').getContext('2d');
-        }
-        _legendMeasureCtx.font = MSA_LOGO_FONT_PX + 'px monospace';
-        let m = _legendMeasureCtx.measureText(ch);
+        let ctx = measureCtx();
+        ctx.font = MSA_LOGO_FONT_PX + 'px monospace';
+        let m = ctx.measureText(ch);
         let ascent = m.actualBoundingBoxAscent;
         let descent = m.actualBoundingBoxDescent;
         if (!(ascent > 0)) {
@@ -9955,6 +10240,114 @@ function (root, d3, forester, phyloXml) {
     // the later one's shadow and glow used to fall across the earlier body,
     // and now lie under it; overlapping shadows of one level no longer
     // darken each other.
+    // ===================== Domain hover =====================
+    // Domain architectures are what Archaeopteryx has always been best at, and
+    // until now the boxes said nothing: you could see a domain but not read
+    // its name, its E-value or where it sits, short of opening the node's data
+    // dialog and finding it in a list. Christian, 2026-09-23.
+    //
+    // The readout is the one the heat map and the alignment already use, so a
+    // hover anywhere in the viewer looks and behaves the same, and it is
+    // placed by placeHoverReadout, which measures the box rather than assuming
+    // a size.
+
+    function domainInfoAt(event) {
+        let t = event.target;
+        return (t && t.__aptxDomain) ? t.__aptxDomain : null;
+    }
+
+    let _domainHovered = null;
+
+    function domainHover(event) {
+        let info = domainInfoAt(event);
+        if (!info) {
+            domainHoverOut();
+            return;
+        }
+        // mousemove fires all the way across a box, and a wide domain is
+        // hundreds of pixels. The TEXT only changes when the box does, so
+        // re-escaping it, reparsing it as HTML and restarting the fade sixty
+        // times a second would be work for a byte-identical result -- and the
+        // restarted transition would keep opacity approaching 0.95 without
+        // ever arriving. The readout must still FOLLOW the pointer, so the
+        // placement runs either way.
+        let tip_el = _node_mouseover_div.node();
+        if (info === _domainHovered) {
+            placeHoverReadout(tip_el, event);
+            return;
+        }
+        _domainHovered = info;
+        let ref = forester.domainReference(info);
+        let txt = 'Domain: ' + (info.name || '(unnamed)') + '<br>';
+        let ev = forester.domainEvalueText(info.evalue);
+        if (ev !== null) {
+            txt += 'E-value: ' + ev + '<br>';
+        }
+        txt += 'Residues: ' + info.from + '–' + info.to
+            + ' (' + ((info.to - info.from) + 1) + ' aa'
+            + (info.proteinLength > 0 ? (' of ' + info.proteinLength) : '') + ')<br>';
+        if (info.tip) {
+            txt += 'Tip: ' + info.tip + '<br>';
+        }
+        if (info.id) {
+            txt += 'Accession: ' + info.id + '<br>';
+        }
+        if (ref) {
+            // A readout that follows the pointer cannot hold a link you could
+            // reach, so the BOX is the link and the readout says so. Written
+            // as a "label: value" row on purpose: markUpDataLabels renders a
+            // line WITHOUT a colon as a section divider (9px bold uppercase
+            // faint), which is the wrong voice entirely for a call to action.
+            txt += ref.exact ? 'Click: the Pfam entry' : 'Click: to look this domain up at InterPro';
+        }
+        tip_el.classList.remove('aptx-light', 'aptx-dark');
+        if (_panelTheme) {
+            tip_el.classList.add('aptx-' + _panelTheme);
+        }
+        _node_mouseover_div.html(markUpDataLabels(escapeHtmlKeepBreaks(txt)));
+        placeHoverReadout(tip_el, event);
+        _node_mouseover_div.transition().duration(100).style('opacity', 0.95);
+    }
+
+    function domainHoverOut() {
+        _domainHovered = null;
+        _node_mouseover_div.transition().duration(300).style('opacity', 1e-6);
+    }
+
+    let _domainOpenedAt = 0;
+
+    function domainClicked(event) {
+        let info = domainInfoAt(event);
+        if (!info) {
+            return;
+        }
+        // A click that LANDED on a box is the box's, whether or not it has
+        // somewhere to send you; letting an unlinkable domain fall through
+        // would open the node menu for whatever node is within five units.
+        event.stopPropagation();
+        let ref = forester.domainReference(info);
+        if (!ref) {
+            return;
+        }
+        // Double-clicking is the natural gesture for "open this", and it
+        // arrives as two clicks: without this it opens two identical tabs.
+        let now = Date.now();
+        if ((now - _domainOpenedAt) < 500) {
+            return;
+        }
+        _domainOpenedAt = now;
+        openExternal(ref.url);
+    }
+
+    // The tree zooms on double click. Over a domain box the gesture means the
+    // box, so the zoom must not also happen behind the tabs that just opened.
+    function domainDblClicked(event) {
+        if (domainInfoAt(event)) {
+            event.stopPropagation();
+            event.preventDefault();
+        }
+    }
+
     function drawDomainArchitectures() {
         if (!_svgGroup) {
             return;
@@ -9966,6 +10359,7 @@ function (root, d3, forester, phyloXml) {
         let f = tips.length > 0 ? domainScale() : 0;
         if (tips.length === 0 || !(f > 0) || !isFinite(f)) {
             existing.remove();
+            domainHoverOut();   // the box under the pointer just stopped existing
             return;
         }
         // [defs, the batched paths, the bodies, the names], kept between
@@ -9985,6 +10379,20 @@ function (root, d3, forester, phyloXml) {
         let underLayer = g.children[1];
         let bodyLayer = g.children[2];
         let labelLayer = g.children[3];
+        // The group ignores the mouse so the tree underneath stays clickable;
+        // the BODIES alone take it back, so a hover lands on a domain and not
+        // on its shadow, its glow or its label.
+        bodyLayer.style.pointerEvents = 'auto';
+        if (!bodyLayer.__aptxWired) {
+            bodyLayer.__aptxWired = true;
+            // mousemove alone, as the heat map and the alignment do it: a
+            // mouseover is always followed by a mousemove, so binding both
+            // only built the readout twice on entry.
+            bodyLayer.addEventListener('mousemove', domainHover);
+            bodyLayer.addEventListener('mouseout', domainHoverOut);
+            bodyLayer.addEventListener('click', domainClicked);
+            bodyLayer.addEventListener('dblclick', domainDblClicked);
+        }
 
         // one vertical gradient per base colour, lighter at the top; the
         // defs ride into the SVG / PDF / PNG exports with the boxes
@@ -10087,6 +10495,10 @@ function (root, d3, forester, phyloXml) {
             }
             let set = row.transform ? pathSet() : track;
             let geo = forester.domainBoxes(da, row.start, f, _state.domainEvalueExponent);
+            // once per ROW: displayNodeName walks the node's properties when a
+            // label-ref visualization is on, and a row can hold dozens of boxes
+            let rowTip = displayNodeName(row.d) || '';
+            let rowLength = Number(da.length) || 0;
             let h = row.h;
             let y1 = row.y1;
             set.backbones.push(roundRectPath(geo.backbone.x, y1 + (h / 2) - 0.5, geo.backbone.w, 1, 0));
@@ -10110,7 +10522,13 @@ function (root, d3, forester, phyloXml) {
                     });
                 }
                 bodies.push({x: b.x, y: y1, w: b.w, h: h, r: r, transform: row.transform,
-                    fill: gradientFor(base), stroke: forester.domainDarken(base, 0.24)});
+                    fill: gradientFor(base), stroke: forester.domainDarken(base, 0.24),
+                    // what the hover readout says. Carried per BOX rather than
+                    // looked up again on hover: the boxes are pooled and
+                    // reused between redraws, so an index into the tree would
+                    // go stale the moment the tips on screen change.
+                    info: {name: b.name, from: b.from, to: b.to, evalue: b.evalue, id: b.id,
+                        tip: rowTip, proteinLength: rowLength}});
                 if (row.labelsOn && b.name && fs > 4 && legendTextWidth(b.name, font) <= b.w - 4) {
                     names.push({x: b.x + (b.w / 2), y: y1 + (h / 2), font: font,
                         fill: forester.domainLabelInk(base), text: b.name});
@@ -10134,6 +10552,11 @@ function (root, d3, forester, phyloXml) {
             paths[k].style.fill = u.fill;
             paths[k].style.fillOpacity = u.opacity;
         });
+        // A redraw can take the hovered box away without the pointer moving
+        // -- a keyboard zoom, a panel change applied with Enter, a collapse --
+        // and a removed element fires no mouseout, so the readout would stay
+        // painted over a domain that is no longer there.
+        domainHoverOut();
         let rects = sizeLayer(bodyLayer, 'rect', bodies.length);
         bodies.forEach(function (b, k) {
             let el = rects[k];
@@ -10151,6 +10574,11 @@ function (root, d3, forester, phyloXml) {
             el.style.fill = b.fill;
             el.style.stroke = b.stroke;
             el.style.strokeWidth = 1;
+            el.__aptxDomain = b.info;
+            // only where there is somewhere to go: an unnamed domain with no
+            // accession has no reference, and a hand cursor over it would
+            // promise a link that the click cannot deliver
+            el.style.cursor = forester.domainReference(b.info) ? 'pointer' : 'default';
         });
         let texts = sizeLayer(labelLayer, 'text', names.length);
         names.forEach(function (t, k) {
@@ -11936,10 +12364,11 @@ function (root, d3, forester, phyloXml) {
         if (alignBtn) {
             alignBtn.disabled = _state.unrootedDisplay || _basicTreeProperties.branchLengths !== true;
         }
-        let dyna = byId(DYNAHIDE_CB);
-        if (dyna) {
-            dyna.disabled = _state.unrootedDisplay;
-        }
+        // Auto-hide Labels stays live in every layout. It used to be greyed out
+        // in unrooted, where the tip-label decimation it governs does not run --
+        // but it also governs the crowded branch-data rule, which does run
+        // there, so greying it out left the user unable to switch off something
+        // that was happening.
         let msaCb = byId(MSA_CB);
         if (msaCb) {
             msaCb.disabled = radialDisplay();
@@ -12167,7 +12596,8 @@ function (root, d3, forester, phyloXml) {
         }
         item.classList.toggle('aptx-check-active', !!active);
         item.title = active
-            ? item.dataset.baseTitle + ', hiding now: 1 in ' + _dynahide_factor + ' labels shown'
+            ? item.dataset.baseTitle + ', hiding now: 1 in ' + _dynahide_factor
+                + ' labels shown, and branch data that would overlap'
             : item.dataset.baseTitle;
     }
 
@@ -15084,10 +15514,10 @@ function (root, d3, forester, phyloXml) {
             // "Auto-hide Labels" matches the desktop, which renamed the historical
             // "Dyna Hide" because that named the mechanism rather than what the user
             // sees. The _state.dynahide field keeps its name internally.
-            opts.push(makeCheckboxItem('Auto-hide Labels', DYNAHIDE_CB, 'automatically hide external labels when the tree is too dense for them to be readable', true));
+            opts.push(makeCheckboxItem('Auto-hide Labels', DYNAHIDE_CB, 'automatically hide external labels, and branch values that would overprint each other, where the tree is too dense for them to be readable', true));
             opts.push(makeCheckboxItem('Short Names', SHORTEN_NODE_NAME_CB, 'to shorten long node names'));
             if (_basicTreeProperties.confidences) {
-                opts.push(makeCheckboxItem('Support Dots', SUPPORT_DOTS_CB, 'to mark every branch with support of at least ' + _settings.supportDotMinimum + '% with a dot at its midpoint'));
+                opts.push(makeCheckboxItem('Support Dots', SUPPORT_DOTS_CB, 'to mark a branch with support of at least ' + _settings.supportDotMinimum + '% with a dot at its midpoint, where there is room to draw it'));
             }
             // Styles and visualizations sit here too, so the Nodes group only
             // appears at all on a tree carrying node/branch events

package/forester.js

@@ -20,7 +20,7 @@
  *
  */
 
-// v 3.14.0
+// v 3.15.0
 // 2026-09-17
 //
 // forester.js is a general suite for dealing with phylogenetic trees.
@@ -3814,6 +3814,187 @@
     };
 
 
+    // The nodes of `list` in PREORDER -- root first, then each subtree -- which
+    // is the claim order the crowded-data rule needs and is NOT the order the
+    // layout hands out. d3's descendants() is BREADTH-first (r,a,b,a1,a2,b1),
+    // and the viewer reverses it for drawing, which puts the root LAST. Taking
+    // that order for preorder inverts the whole rule: the leaf-most mark wins
+    // and the one nearer the root is dropped, which is the opposite of what
+    // the desktop does. Measured, after a review caught it: "descendants()
+    // r,a,b,a1,a2,b1" and "reversed b1,a2,a1,b,a,r".
+    //
+    // Derived from the node objects rather than from any layout, so it cannot
+    // drift with one: the root is the member whose parent is not itself in the
+    // list, and children are visited in their own order. A node whose parent
+    // is absent (a subtree view) roots its own walk, and anything unreachable
+    // is appended so no mark is silently skipped.
+    forester.preorderOf = function (list) {
+        let present = new Set(list);
+        let out = [];
+        let seen = new Set();
+        function walk(n) {
+            if (seen.has(n)) {
+                return;
+            }
+            seen.add(n);
+            out.push(n);
+            let kids = n.children;
+            if (kids) {
+                for (let i = 0; i < kids.length; ++i) {
+                    if (present.has(kids[i])) {
+                        walk(kids[i]);
+                    }
+                }
+            }
+        }
+        for (let i = 0; i < list.length; ++i) {
+            let n = list[i];
+            if (!n.parent || !present.has(n.parent)) {
+                walk(n);
+            }
+        }
+        for (let i = 0; i < list.length; ++i) {
+            if (!seen.has(list[i])) {
+                out.push(list[i]);   // a cycle or a detached node: never dropped
+            }
+        }
+        return out;
+    };
+
+    // The box to claim for a mark that RIDES ITS BRANCH -- the circular and
+    // unrooted layouts, where a label is turned to the branch's direction
+    // instead of standing along a row. The axis-aligned bounds of the turned
+    // rectangle, centred on (cx, cy):
+    //
+    //     rot_w = |w*cos(a)| + |h*sin(a)|
+    //     rot_h = |w*sin(a)| + |h*cos(a)|
+    //
+    // The desktop's formula, verbatim (TreePanel.paintBranchDataRadial), and
+    // the second half of the joint rule below. It carries between the two
+    // programs because both measure it in real SCREEN space -- the layout's
+    // own units do not survive the trip, which is why this was parked as a
+    // divergence until forester-71 sent the arithmetic.
+    //
+    // Deliberately conservative: a diagonal label's bounds are wider than its
+    // ink, so a crowded number is dropped rather than overprinted. Exact at
+    // the right angles, worst at 45 degrees. Insensitive to the sign of the
+    // angle and to a half turn, which is what lets the 180-degree flip that
+    // keeps the far half of a fan upright leave the box alone.
+    forester.rotatedLabelBox = function (cx, cy, w, h, angle) {
+        let cos = Math.abs(Math.cos(angle));
+        let sin = Math.abs(Math.sin(angle));
+        let rw = (w * cos) + (h * sin);
+        let rh = (w * sin) + (h * cos);
+        return [cx - (rw / 2), cy - (rh / 2), rw, rh];
+    };
+
+    // The occupancy map behind "auto-hide crowded branch data": a mark is
+    // drawn only when its box overlaps nothing already granted in the same
+    // pass. Ported from the desktop's LabelOccupancy (0.11.161) as a JOINT
+    // rule on Christian's word, 2026-09-25, so neither side retunes it alone.
+    //
+    // Here rather than in the viewer because it is a pure algorithm and the
+    // suite can reach it: the parts that MUST match the desktop -- first claim
+    // wins, a refused claim records nothing, a zero-size box is granted and
+    // not recorded, and boxes that merely touch do not overlap -- are exactly
+    // the parts no screenshot would show going wrong.
+    // A uniform grid rather than all-pairs: a 13,246-tip tree with branch
+    // lengths on offers 18,511 boxes, and 171 million comparisons per redraw
+    // is not a redraw.
+    forester.labelOccupancy = function (cell) {
+        let size = Math.max(4, cell);
+        let cells = new Map();
+        return {
+            // true when nothing already granted overlaps, and then recorded
+            claim: function (x, y, w, h) {
+                if (!(w > 0) || !(h > 0)) {
+                    return true;   // reserves no space; recording it would only cost comparisons
+                }
+                let c0 = Math.floor(x / size), c1 = Math.floor((x + w) / size);
+                let r0 = Math.floor(y / size), r1 = Math.floor((y + h) / size);
+                for (let c = c0; c <= c1; ++c) {
+                    for (let r = r0; r <= r1; ++r) {
+                        let bucket = cells.get(c + ':' + r);
+                        if (!bucket) {
+                            continue;
+                        }
+                        for (let i = 0; i < bucket.length; ++i) {
+                            let b = bucket[i];
+                            // strict: boxes that merely touch do not overlap
+                            if (x < (b[0] + b[2]) && (x + w) > b[0]
+                                && y < (b[1] + b[3]) && (y + h) > b[1]) {
+                                return false;
+                            }
+                        }
+                    }
+                }
+                let box = [x, y, w, h];
+                for (let c = c0; c <= c1; ++c) {
+                    for (let r = r0; r <= r1; ++r) {
+                        let key = c + ':' + r;
+                        let bucket = cells.get(key);
+                        if (!bucket) {
+                            bucket = [];
+                            cells.set(key, bucket);
+                        }
+                        bucket.push(box);
+                    }
+                }
+                return true;
+            }
+        };
+    };
+
+    // Where a protein domain can be read about, as {url, exact} or null.
+    //
+    // An InterPro ENTRY is addressed by ACCESSION and by nothing else --
+    // measured, not assumed: /api/entry/pfam/PF00931/ answers 200 and names
+    // NB-ARC, while /api/entry/pfam/NB-ARC/, /CARD/ and /Death/ are all 404.
+    // phyloXML's <domain id="..."> carries the accession when the annotation
+    // had one, and most files have none (our own apaf.xml names all 166 of its
+    // boxes and gives not one an id), so the fallback is an InterPro text
+    // search.
+    //
+    // The search goes by NAME, never by the id. An id that is not a bare Pfam
+    // accession -- a versioned one from an hmmscan (PF00931.24), or a SMART or
+    // CDD accession -- searches to nothing, while the name is exactly what a
+    // text search is for. A version suffix is stripped for the entry URL
+    // rather than disqualifying it: PF00931.24 IS PF00931.
+    //
+    // Lives here rather than in the viewer so it can be tested: a wrong URL
+    // fails silently in someone else's browser, which is the worst place to
+    // find out.
+    const INTERPRO_ENTRY = 'https://www.ebi.ac.uk/interpro/entry/pfam/';
+    const INTERPRO_SEARCH = 'https://www.ebi.ac.uk/interpro/search/text/';
+
+    forester.domainReference = function (domain) {
+        if (!domain) {
+            return null;
+        }
+        let id = (domain.id || '').trim();
+        let acc = /^(PF\d{5,})(?:\.\d+)?$/i.exec(id);
+        if (acc) {
+            return {url: INTERPRO_ENTRY + acc[1].toUpperCase() + '/', exact: true};
+        }
+        let q = (domain.name || '').trim() || id;
+        return q ? {url: INTERPRO_SEARCH + encodeURIComponent(q) + '/', exact: false} : null;
+    };
+
+    // A domain's E-value for display. It spans many orders of magnitude, so a
+    // small one keeps its exponent; the count of significant digits is the
+    // only thing normalized, because a scan writes 7.2E-117 and 1E-6 and a
+    // readout that mixed those forms would read as two different measures.
+    forester.domainEvalueText = function (e) {
+        if (typeof e !== 'number' || !isFinite(e)) {
+            return null;
+        }
+        if (e === 0) {
+            return '0';
+        }
+        return (Math.abs(e) >= 0.001 && Math.abs(e) < 1e7)
+            ? String(forester.roundNumber(e, 6)) : e.toExponential(2);
+    };
+
     // Everything the Tree Properties dialog reports, gathered in ONE pass:
     // the desktop's TreeFacts.scan, minus its histogram (Christian, 2026-09-23:
     // "we don't need a histogram ... but a more detailed stats would be
@@ -6933,7 +7114,13 @@
                 ignored++;
                 return;
             }
-            domains.push({name: d.name ? String(d.name) : '', from: from, to: to, length: to - from + 1, evalue: e});
+            // `id` is phyloXML's optional domain identifier, which for a Pfam
+            // scan is the accession (PF00931). Carried through because the
+            // hover readout links to the entry with it when it is there, and
+            // has to search by name when it is not -- apaf.xml, our own domain
+            // demo, has names and no ids at all.
+            domains.push({name: d.name ? String(d.name) : '', from: from, to: to,
+                length: to - from + 1, evalue: e, id: d.id ? String(d.id) : ''});
         });
         domains.sort(function (a, b) {
             return a.from - b.from;
@@ -7035,7 +7222,8 @@
             if (!(w > 0) || !isFinite(w)) {
                 return;
             }
-            boxes.push({name: d.name, x: start + ((d.from - 1) * f), w: w, from: d.from, to: d.to, evalue: d.evalue});
+            boxes.push({name: d.name, x: start + ((d.from - 1) * f), w: w, from: d.from, to: d.to,
+                evalue: d.evalue, id: d.id});
         });
         return {backbone: {x: start, w: Number(da.length) * f}, boxes: boxes};
     };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "archaeopteryx",
-  "version": "3.14.0",
+  "version": "3.15.0",
   "description": "Archaeopteryx.js is a software tool for the visualization and analysis of highly annotated phylogenetic trees.",
   "main": "archaeopteryx.js",
   "types": "archaeopteryx.d.ts",