Javascript Chart.js获取图形上当前可见点的数组

使用启用缩放/平移的Chart.js，我试图编写一个函数，将画布上可见的内容导出为CSV

但是我不知道如何在用户缩放/平移后只获取可见的数据点

我知道我可以只查看

myChart.data.dataset

，但这将获取图表中的所有点，而不仅仅是当前可见的点

var config = {
    type: 'line',
    data: {
        // data is from API call
    }
        pan: {
            enabled: true,
            mode: 'xy'
        },
        zoom: {
            enabled: true,
            mode: 'xy'
        },
        bezierCurve : false
    }
};

var ctx = document.getElementById('myChart').getContext('2d');
window.myChart = new Chart(ctx, config);

$('#exportTheseRunsToCSV').on('click', function() {
    // something like myChart.getVisibleDataPoints() ???
    console.log(chart)
    console.log(chart.data.datasets)
});

必须有一些内部API调用才能获取可见点，因为我还有一个函数可以将当前可见点导出到PNG，并且只获取画布上当前绘制的内容：

<a id="exportTheseRuns" class="text-white" href="#" download="image.png" download><i class="fas fa-download"></i> Export to PNG</a>

$('#exportTheseRuns').on('click', function() {
    $('#exportTheseRuns').attr('href', myChart.toBase64Image());
})

$（'#exportTheseRuns'）。在（'单击'，函数（）上）{
$（'#exportTheseRuns'）.attr（'href'，myChart.toBase64Image（））；
})

---

函数

.toBase64Image（）

看起来像是在内部执行我要查找的操作，因为它只捕获可见点，但随后它返回一个Base64 URI，我无法用于我的

arrayToCSV

函数。

toBase64Image

函数不是您想要的，它只是从画布获取数据URL

---

您可以使用

onZoomComplete

和

onPanComplete

获取更新的图表数据，它们都会获取包含

chart

的对象。从中，您可以获得有关当前缩放的更多信息，但据我所知，您需要进行一些计算/工作以获得可见点…

图表对象包含可用于数据集的可见值的

minIndex

和

maxIndex

属性

以下是一个片段，显示了如何在平移或缩放图表后使用输出可见值：

函数getVisibleValues({
图表
}) {
设x=图表。比例[“x轴-0”]；
document.getElementById（“vv”）.innerText=JSON.stringify（chart.data.datasets[0].data.slice（x.minIndex，x.maxIndex+1））；
}
新图表（document.getElementById（“图表”）{
键入：“行”，
数据：{
标签：['a'，'b'，'c'，'d'，'e'，'f'，'g'，'h'，'i'，'j']，
数据集：[{
数据：[0,1,2,4,8,16,32,64,128,256]
}]
},
选项：{
MaintaintAspectRatio:false，
比例：{
xAxes：[{
滴答声：{
min:'c'，
马克斯：“h”
}
}]
},
插件：{
缩放：{
潘：{
启用：对，
模式：“x”，
onPanComplete:getVisibleValues
},
缩放：{
启用：对，
模式：“x”，
onZoomComplete:getVisibleValues
}
}
}
}
});


可见值：
非常感谢，这正是我想要的。我原以为会有一个烘焙的函数，但这同样有效。
toBase64Image: function() {
  return this.canvas.toDataURL.apply(this.canvas, arguments);
},