[v-2.0] Linechart x-scale gets confused with a lot of datapoints.

[stephanarts]

When the number of datapoints / width ratio is too high, the chart is no longer rendering it correctly.

This is with 60 datapoints that can be rendered correctly:

But when the width is reduced, it appears like this:

This is the configuration (minus the set of datapoints):

var config = {
    type: 'line',
    data: {
        datasets: [
            {   
                label: "",
                fillColor: "rgba(220,220,220,0.2)",
                strokeColor: "rgba(110,110,220,1)",
                pointColor: "rgba(220,220,220,1)",
                pointStrokeColor: "#fff",
                pointHighlightFill: "#fff",
                pointHighlightStroke: "rgba(220,220,220,1)",
                data: [{x:'0',y:'1'}]
            }
        ]
    },
    options: {
        responsive: true,
        scales: {
            xAxes: [{
                type: "time",
                display: true,
                time: {
                    format: 'MM/DD/YYYY HH:mm:SS',
                },  
                scaleLabel: {
                    show: true,
                    labelString: 'Date'
                }   
            }],
            yAxes: [{
                display: true,
                ticks: {
                    beginAtZero: true,
                },  
                scaleLabel: {
                    show: true,
                    labelString: 'value'
                }
            }]
        },
        elements: {
            line: {
                tension: 0.3
            }
        },
    }
};

Edit:
Looking at it again made me realise this probably has something to do with the rounding of the ticks to whole hours... maybe it's intended behaviour, but I find it looking odd. Especially because I do have data that could be displayed in the 'blank' area if I wanted to.

[etimberg]

I think what happens is that the time scale decides that it can't show 1 hour increments for all the data, and jumps up to 1 day instead of trying 2 hours, 3 hours, etc. Shouldn't be too hard to address

[tannerlinsley]

I'm not sure the approach to take to fix that. Any ideas would be appreciated.

[etimberg]

I have some ideas that in theory don't sound too hard. Will try and design it out.

[stephanarts]

It actually goes from 2 minute increments to 1 hour increments.

IMHO 1,5,10,15 30 and 60 minute increments would make more sense for a timeline at this scale.

I am curious what kind of solution you come up with.

[tannerlinsley]

We talked a bit about partial ticks. I also really like your suggestion. Making another tick level that is in fact 15 minute increments of an hour. To that we could add more like 6 or 12 hour increments for days, etc. Really anything that is a common partial time unit. @etimberg? This way we wouldn't really need to do partial ticks and instead just create enough specificity levels to accommodate any time range.

[stephanarts]

@tannerlinsley I don't think this would be a replacement for partial ticks. The behaviour I showed above would still occur with the smaller time units. You would see an empty graph where you would not expect it.

Closely related to this, I come to think of the following. Maybe implement suggestedMin/suggestedMax for the X-axis? If you want to show a graph from 01:10 to 03:10 but happen to only have data starting at 01:15 and ending at 01:45... how would you do that? (Imagine wanting to show a floating window of the last 2 hours of data, and it's 03:10 now).

[tannerlinsley]

There the "to" and "from" properties that limit the min and max of the x scale. Will that not do?

[stephanarts]

Hmm, it might. Let me try.

Yes it would.

[tannerlinsley]

It's scale.options.time.to/from I think.

[tannerlinsley]

Oh good.

[stephanarts]

I set it like this:

config.options.scales.xAxes[0].time.from = config.data.datasets[0].data[0].x

But that does not override the rounding of the intervals.

[etimberg]

@stephanarts I have a PR for this in #1724

[stephanarts]

Nice, I hope I have the time to check this this week.

[stephanarts]

Nice, I love it. I think it works nicely.