walterra / d3-milestones

A d3 based timeline visualization.
https://walterra.github.io/d3-milestones
Other
146 stars 27 forks source link

Using times that are ordinal, but not time formats #15

Open nicola opened 4 years ago

nicola commented 4 years ago

Awesome work!

I was using it in order to model a series of events happening in rounds - in this case rounds do not map to "time" formats, since they are "round 1", "round 2"... Is there a way to avoid using a specific timestamp?

walterra commented 4 years ago

Thanks for the feedback! To fully support that I'll need to make some changes in the next release.

Maybe you can work around it like this for now: Make the setup think your rounds are years. It will be treated internally as a year but it shouldn't be noticeable in the rendered chart.

<script>
  milestones('#timeline')
    .mapping({
      'timestamp': 'round',
      'text': 'title'
    })
    .parseTime('%Y')
    .labelFormat('Round %Y')
    .render([
      { round: 1, title: 'My first round' },
      { round: 2, title: 'Another round' }
      ...
      { round: 10, title: 'Lots of rounds' },
      { round: 11, title: 'The last round' }
    ]);
</script>
nicola commented 4 years ago

Awesome! Thank you and keep on doing fantastic work!

mmattozzi commented 3 years ago

Hello -- I really appreciate the simplicity of this visualization, thanks for producing it! I was interested in a case similar to this issue where I wanted to represent time points in a video (measured in seconds or ms). The numbers get large enough pretty quickly such that treating whole numbers as years isn't effective. I was also interested in formatting the time as a duration, like 00:00:01:23.456 (HH:MM:SS.LLL). I ended up hacking around a bit to produce how I wanted it to look, but it was not a very coherent solution. I was wondering if you've already started work on ordinal support or if you were open to a PR if I get my thoughts together. Thanks!