Description
- I discern few CSS classes in a Plot:
<svg class="plot " ...
<g class="tick" ...
For now, all texts inherit a generic .plot class (10px, system-ui...) In the following example, there is no visual difference between the axis label and the orange bar label :
It would be useful to tag each chart component with a specific class, especially regarding texts and axes (everything that is not linked to a channel). This would allow us to differentiate and style them with CSS, without having to do it by hand in the form of attributes added to the Plot spec:
- axis labels
- tick labels
- facet labels
- more broadly: title, subtitle and source of the graph, annotations...
An alternative, which is not exclusive, is to specify attributes as in D3, but it seems to me much more elegant, light, standard and extensible to do it in CSS, especially if it is repetitive.
It would also be useful to be able to assign an id to a Plot.
- The SVG export (download SVG) is not of good quality for texts, it does not include relevant CSS classes.
These should be inserted into the SVG. A simple mechanism could also allow custom CSS definitions to be linked to the current Plot, so that they can also be found in the SVG export.
PS: Plot is a great library, very intellectually stimulating, and the 21 beautifully written articles in the https://observablehq.com/collection/@observablehq/plot collection should be read by all data scientists!