Identifying SVG elements

New To Observable
1

Hello, I’m new to observable plot, and am trying to figure out a good way to give SVG elements created by Plot.plot a unique label so I can find them later through e.g. d3.

As a hack, currently, I’m trying to give Plot.ruleX an ariaLabel and even though this turns up in the MarkOptions, the generated SVG group and line don’t have them. So, this does NOT work:

rule = Plot.ruleX(..., {ariaLabel: "abc"})

However, setting the object later, does work (but it’s really hacky, as this attribute is not in the documented types):

rule = Plot.ruleX(...)
rule.ariaLabel = "abc"

So, I’m now wondering if there is any official and supported way to do something similar.

2

You could try ariaDescription instead. (And there are yet other ways, if this doesn’t work for your use case.)

3

Hi @Fil, thank you for your answer, I learned this seems to be an ongoing discussion. I saw you proposed a className option on github (className option for marks · Issue #1002 · observablehq/plot · GitHub) and I also saw the discussion about adding data attributes (Add possibility to include a data attribute to text element. by lotusjohn · Pull Request #1841 · observablehq/plot · GitHub). I am kind of surprised that aria attributes are the workaround right now.