Skip to content

Unable to highlight with a custom style #473

@Mirekium

Description

@Mirekium

Hello,

I am trying to customize the highlighting in phylotree.js (v2.x) — whether for internal nodes, leaves, or edges — and specifically to highlight all descendants of an internal node with a particular style (for example, color or dashed lines).

I have tested several methods:

  • Setting the selected property on all descendants

  • Adding a custom tag (e.g., customStyle = "descendant")

But nothing works: the style does not apply, whether through selected or a custom property used in edge-styler or node-styler.

tree.render({ edge-styler: edgeStyler });`

`// Attempt to mark all descendants from an internal node
tree.selectAllDescendants(selectedNode, true, true)
.forEach(n => n.selected = true); // or n.customStyle = "descendant"

// In my edge-styler
function edgeStylerSelectDesc(dom_element, edge_object) {
if (edge_object && edge_object.target && edge_object.target.selected) {
// or if (edge_object && edge_object.target && edge_object.target.customStyle === "descendant") {
dom_element.attr("stroke", "#1f77b4")
.attr("stroke-width", "3px")
.attr("stroke-dasharray", "10,2");
}
}
tree.render({ edge-styler: edgeStylerSelectDesc});
tree.update();`

Is there a solution or an example to apply a specific style (and not just the native selection) to all descendants of an internal node?

Thank you in advance for any lead or solution!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions