x-axis labels jump (includes builder example as reproducer)

[arnehormann]

In an example created in your amazing builder (code below), time labels are displayed in 6-seconds intervals. The offset cycles after some frames - between 0, 2 and 4, probably depending on the scroll position. Visually, this leads to very distracting jumps.

This may be a duplicate of #53 - depending on what "flickering" is.

html:

<canvas id="smoothie-chart" width="893" height="258">

javascript:

var chart = new SmoothieChart({millisPerPixel:78,maxValueScale:1.23,interpolation:'step',scaleSmoothing:0.092,grid:{fillStyle:'rgba(0,0,0,0.97)',strokeStyle:'#2f2e2f',sharpLines:true,millisPerLine:2000,verticalSections:10,borderVisible:false},labels:{fillStyle:'rgba(255,255,255,0.51)',fontSize:12},timestampFormatter:SmoothieChart.timeFormatter,horizontalLines:[{color:'#ffffff',lineWidth:1,value:0},{color:'#880000',lineWidth:2,value:3333},{color:'#880000',lineWidth:2,value:-3333}]}),
    canvas = document.getElementById('smoothie-chart'),
    series = new TimeSeries();

chart.addTimeSeries(series, {lineWidth:2,strokeStyle:'none',fillStyle:'rgba(75,177,255,0.30)'});
chart.streamTo(canvas, 342);

I don't use smoothie yet, but it's a great library, really cool! I'm definitely going to use it! :+1:

[drewnoakes]

Thanks for the example. You're right -- this is the same issue as 53. Want to take a stab at fixing it?

[arnehormann]

I'd like to, but right now, I can't. Sorry. I could definitely dig into it when I intend to use it, but I can't provide a reliable timeframe.

[drewnoakes]

In the past I worked around this by increasing the spacing of lines.