Chart.js 重置缩放按钮

Question

我使用的是 Chart.js API 版本 3.4.1，并且有一个按钮可以在缩放后重置图表。当我单击按钮时，返回以下错误:

Uncaught TypeError: $(...).resetZoom is not a function

HTML 代码:

<canvas id="grafico3" style="background-color: #DCDCDC"></canvas>
<a class="btn btn-default" onclick="resetZoom3();" >Reset Zoom</a>

JS代码:

function resetZoom3() {
    $("grafico3").resetZoom();
}

有人知道重置图表的缩放吗？

Answer 1

您正在尝试访问 Canvas 元素，该元素不包含图表实例。您需要在图表实例上调用 resetZoom，因此在通过调用 new Chart 制作图表时，您需要将其存储在一个变量中，您可以引用该变量来调用重置开启。

所以你会得到这样的结果:

const chart = new Chart(ctx, config);

chart.resetZoom();