TreeSS expressions - TreeViz/metastyle GitHub Wiki
A "stretch goal" of TreeSS is to define values in terms of other units, or tree attributes, etc. This would provide an easy way to map (e.g.) a node's support value to its size:
.node[support < 0.5] {
size: support * 10px;
}
N.B. CSS expressions (aka "dynamic properties") have long been deprecated, even in browsers that introduced them, apparently in favor of using Javascript. Should this give us pause?
Dynamic properties (also called "CSS expressions") are no longer supported in Internet Explorer 8 and later, in IE8 Standards mode and higher. This decision was made for standards compliance, browser performance, and security reasons. ... Other dynamic properties with more specific uses can generally be replaced with standard JavaScript. [source]
Would expressions potentially ruin performance? Since some properties are dependent on others, they might need frequent recalculation. But maybe we always assume a total refresh of all styles.
In any case, we can't dodge this challenge. Some of our [core use cases](TODO:link to top ten!) require styles that depend on tree properties. We might consider extending the newer attr
and calc
functions in CSS3, esp. so each can refer to adjacent elements, e.g. an edge's target node:
.edge[support < 0.5] {
thickness: calc( node.support * 10px );
}
If we can't handle something like this, we'd need to add scripting support (JS or otherwise) as a requirement. It's probably better for our property-resolution code to conflate closely-related elements. So looking for 'support' on an edge would ultimately check its adjacent node (and perhaps the tree?) as a last resort. We do some of this now in the ETE proof-of-concept code, but it doesn't yet consider phylogenetic relationships when looking for a matching property.