[SOLVED] Is there a way to represent a ancient date (BCE) in mermaid timeline or gantt chart markdown?

Is there a way to represent a ancient date (BCE) in mermaid timeline or gantt chart markdown?

I am trying to represent a Gantt chart of historical events in Mermaid markdown. The dates would be Before Common Era (BCE, or BC), but I am not sure this can be done.

The markdown would look like this:

gantt
    title Roman Kings Timeline
    dateFormat  YYYY
    axisFormat %Y

    Romulus: rm, 753 BCE, 37y
    Numa Pompilius: np, 715 BCE, 42y
    Tullius Hostilius: th, 673 BCE, 32y
    
    [...]

but this, of course, does not work.

I looked in the docs and online.Maybe it's not possible...

Solution

Years BCE are expressed with a minus sign followed by six digits (a so-called "expanded year"). That's how the Javascript Date class handles it, and so do Javascript-based mermaid renderers.

<script type="module" src="https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs"></script>
<pre class="mermaid">
gantt
    title Roman Kings Timeline
    dateFormat YYYY
    axisFormat %Y
    Romulus: rm, -000753, 37y
    Numa Pompilius: np, -000715, 42y
    Tullius Hostilius: th, -000673, 32y
</pre>

Note, however, that Javascript assumes a year 0, so this approach may not work for later periods of Roman history.