How to build a bitemporal visualization?

[refset]

Hi, I built this simple web tool a few months ago to help with understanding bitemporal data: https://bitemporal-visualizer.github.io/

I am curious whether anyone could recommend how I might best approach (re-)building something like the visualization shown using Vega / Vega-Lite? Is there an existing visualization example that would be suitable for ~easy adaptation or initial study? Or a particular tutorial/blog on creating a new visualization "from scratch" that might be appropriate?

Currently my tool is just a modest amount of hand-rolled Clojure (scittle, to be precise) that outputs SVG directly. The plotted rectangles are guaranteed to be non-overlapping in the basic case because they represent a coherent history of a single record, however an ability to overlay multiple plots (e.g. using transparency, or additional rectangles) would be an interesting direction for the future, to understand the histories of multiple records.

Additionally, the interactive binding between the HTML table and the SVG plot in my tool is a handy consequence of Clojure's equality semantics, but I don't mind abandoning Clojure here if it results in a more generic visualization component. Are there examples out there that demonstrate a similar two-way interactive experience alongside a non-Vega HTML-based component? I found this discussion which suggests a few options, but I haven't seen anything that makes me feel confident about replicating the flexibility of what I have currently. I also realise that a non-HTML table could be viable (suggested here) and haven't ruled that out as an option.