Open joschne opened 4 months ago
Here is a codepen link to the component I was able to code. I created a dummy repo to simulate some data. For now it ticks most of the boxes.
What it does
What it doesn't do
return [{ mode: 'lines', x: x, y: y }];
with
return [{ type: 'bar', x: x, y: y }];
Note
Nice job @zedz318 ! :-)
In the Plotly documentation I saw that there are histograms that may fit our ideas.
I am going to create a second POC with type: 'histogram'
instead of 'lines'
or 'bar'
.
After that, we'll probably need a meeting.
Here is a stackblitz example of using plotly historgram for the timeline with bars.
What it does
'century' | 'decade' | 'year' | 'month' | 'day'
day
an interval 1400-01-01
to 1400–12-31
is mapped to all 365 days of the year 1400.'month' | 'day'
Problems
addToBins()
function is not good)'century' | 'decade' | 'year'
:
1400-1499
instead of Jan 1400
1400-1409
instead of Dec 1409
1400
instead of Jan 1400
Hello! Sorry for my delayed response, I had a dental emergency earlier this week and had to recover. I'll be working on this today and I'll get back to you asap.
Hello again! I forked your stackblitz project, this is mine.
Solved
I was able to solve the "on hover" issue.
Problem/Details
Please also keep performance in mind: At the moment, month is a pain to use, day is unusable. Why is that the case? How can we make it faster?
I've been working on this and I think the issue highlighted by @flicksolutions is the same as the one I asked about last in the Problem/Details section number 2. From what I could tell, the reason why it takes too long to render month and day bin sizes is because of how the binning was working. I've changed it and it should be faster and more accurate(I've also increased the range of each datapoint just for testing since it requires more computation this way) Here is the link (it's the same as the one before)
If you want, we can have a 10-20 minute meeting to discuss the details further
Context
For issue #116 we need a timeline
Goal
Have a POC that the requirements can be implemented with Plotly.