[feature] Integrate timeline with flower visualization
Closed this issue · 4 comments
When timeline change, what type of data should be dispatch? I will try to format it accordingly.
@thasarito Thanks krub, I think about Date type since it is easiest to understand and comparable but I'm not sure about the performance. Another choice would be Epoch / Milliseconds (from date.getTime()). Maybe we can go with the date first to see if there will be any performance issue.
I already look at the code briefly, we might be able to use value binding prop to get the result out. (Or another way if you have a suggestion) Or should we update the value once when they release the mouse instead of real-time?
Please note that after I talked with the designer and @puripant, the flower entrance animation does not work quite well with the timeline, since in some period there will be a lot of events and most period there will be no event at all. So we need to make some changes.
- Timeline now acts as a time filter So no animation and playback control is needed.
- Timeline will have a default value to cover the whole domain [min, max].
And I'm so impressed with your code 🔥, I will be back to work on Thursday but please let me know if you have any concern or question anytime.
A quick note is that the time scale of the flower stems goes over the the year 2020 a little bit. It actually starts from July 1, 2019 (6 months before) to June 30, 2021 (6 months after) to put all stems in the middle. The designer approved this choice.
Forget to mention that I already integrated timeline and viz in 435bf28 and dbea415 by adding dateRange prop to the timeline and flower viz component and bind date object with it. The new range of timeline also updated in 56840da. I did refactor a bit of timeline component, so if you have any opinion plese notice me.