Jumpy panning and weird behavior

[Baribj]

Hi there,

I am trying to use candlestick chart for stocks. The panning and zoom features throw all kind of issues.

See jsFiddle here: https://jsfiddle.net/ritwal/1rqwoyu7/5/

Issues:

1- If the following is set:

 x:{
 type: "time",
}

Panning becomes resistant. almost refusing to pan across the chart. To preproduce the issue, try to pan chart to the left and then bring it back to the right.

Also, bars (candles) width don't seem to be correct, they are way too slim when you zoom.

2- if the following is set:

x:{
 type: "linear",
}

This gives a smooth experience with no issues. However, time axis info are, understandably, lost and are displayed as pure numbers.

3- if type is not set:

This seems to give the correct bars (candles) width, however it produces two issues as follow:

1- panning across the X axis doesn't work anymore
2- zooming in sometimes make the bars (candles) become too thin they become a line.

[kurkle]

Its the defaults that chartjs-chart-financial sets for x-scale. Specifically the source of ticks.

So adding this to x-scale config helps:

ticks: {
  source: 'auto'
}

https://jsfiddle.net/jx1aq9h8/

[Baribj]

Its the defaults that chartjs-chart-financial sets for x-scale. Specifically the source of ticks.

So adding this to x-scale config helps:

ticks: {
  source: 'auto'
}

https://jsfiddle.net/jx1aq9h8/

Thanks a lot for the rather quick reply. The lack of documentation on chartjs-chart-financial makes it difficult to track what's going on under the hood.