What is the best way to add a timestamp marker (icon) below the timeline

[rodsmyname]

I am trying to add marker below the timeline of my wavesurfer, something like an icon at various specific spots. I can do this very easily by creating a div that extends the width of the wave form and finding the proper 0-1 width the icons are supposed to go, but, the zoom is the main issue.

In my mind I have two options, creating the div like I said and doing some math to expand it together with the waveform, this is easier said than done however. My other option is to place the icon div inside the shadow root of wavesurfer, next to the timeline, which will actually cause the icon to be properly placed without much trouble, but this way the div would be in the shadow root and it would be a headache to pass states to it.

I saw that there used to be a plugin called markers, which seemed to solve my issue but it doesn't seem to be around anymore. Any ideas on how to properly deal with this?

[katspaugh]

The Regions plugin can create markers, just don’t specify any end time for them, only start time.

[rodsmyname]

Ok I see, it creates a very thin region that can be used as a marker. I want to display an icon at the bottom of the marker, any easy way to do that aside from creating a div containing the icon within the shadow root?

[rodsmyname]

I believe I can use content to do that actually

[katspaugh]

Yes, exactly. You can pass a custom HTML element in the content field and style it either with inline CSS or via a :part selector (add a part attribute for that).