chartjs-plugin-crosshair
chartjs-plugin-crosshair copied to clipboard
The first point of a dataset is duplicated when zooming in on it
When tooltip interpolation is not used, the first point is duplicated on zoom.
This happens for both linear and time axis.
If tooltip interpolation is used the value doesn't seem to be duplicated
https://codepen.io/danmana/pen/GRZQNpR
When zoomed in the dataset.data array contains a duplicate first value
When zoomed out, the data is ok
Looks like the duplicate value is added here, where the zoomed data array is computed:
var newData = [];
var index = 0;
var started = false;
var stop = false;
if (storeOriginals) {
chart.crosshair.originalData[datasetIndex] = chart.data.datasets[datasetIndex].data;
}
var sourceDataset = chart.crosshair.originalData[datasetIndex];
for (var oldDataIndex = 0; oldDataIndex < sourceDataset.length; oldDataIndex++) {
var oldData = sourceDataset[oldDataIndex];
var oldDataX = this.getXScale(chart).getRightValue(oldData)
// append one value outside of bounds
if (oldDataX >= start && !started && index > 0) {
newData.push(sourceDataset[index - 1]);
started = true;
}
if (oldDataX >= start && oldDataX <= end) {
newData.push(oldData);
}
if (oldDataX > end && !stop && index < sourceDataset.length) {
newData.push(oldData);
stop = true;
}
index += 1;
}
chart.data.datasets[datasetIndex].data = newData;
The first time through the loop it enters here:
if (oldDataX >= start && oldDataX <= end) {
newData.push(oldData);
}
The second time through the loop it enters in the if statement above it:
// append one value outside of bounds
if (oldDataX >= start && !started && index > 0) {
newData.push(sourceDataset[index - 1]);
started = true;
}
Maybe we should also set started=true;
in the if (oldDataX >= start && oldDataX <= end)
block ?
(or maybe only set it if index is 0, as the oldData starts directly in the zoomed range)