From a5f99e690f9739d8b34555f541ecb84de6d41275 Mon Sep 17 00:00:00 2001 From: Andrey Date: Sat, 8 Nov 2025 01:55:07 +0300 Subject: [PATCH] docs(legend): update default onClick example for v4 (fixes #12144) --- docs/configuration/legend.md | 15 ++++++--------- 1 file changed, 6 insertions(+), 9 deletions(-) diff --git a/docs/configuration/legend.md b/docs/configuration/legend.md index 1621f5a87d1..3a6db98bb5d 100644 --- a/docs/configuration/legend.md +++ b/docs/configuration/legend.md @@ -162,19 +162,16 @@ const chart = new Chart(ctx, { It can be common to want to trigger different behaviour when clicking an item in the legend. This can be easily achieved using a callback in the config object. +:::tip Updated +Starting from Chart.js v4, use `toggleDataVisibility()` and `update()` instead of the old `show()` / `hide()` methods. +::: + The default legend click handler is: ```javascript function(e, legendItem, legend) { - const index = legendItem.datasetIndex; - const ci = legend.chart; - if (ci.isDatasetVisible(index)) { - ci.hide(index); - legendItem.hidden = true; - } else { - ci.show(index); - legendItem.hidden = false; - } + legend.chart.toggleDataVisibility(legendItem.index); + legend.chart.update(); } ```