question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Chart.defaults.global.tooltips.callbacks.label only works for bar, line

See original GitHub issue

Expected Behavior

Global setting for tooltips for all chart types I would like to use the global settings to set the display of the tooltips without having to do this via the “options”.

Current Behavior

Chart.defaults.global.tooltips.callbacks.label only works for bar, line

Context

Chart.defaults.global.tooltips.callbacks.label = function (	
			tooltipItem,
			data
		) {
			let dataset = data.datasets[tooltipItem.datasetIndex];
			let datasetLabel = dataset.label || ""
			let suffix = dataset.unit || ""
			console.log('Tooltips.label',tooltipItem, data )
			return (
				" " + datasetLabel + ": " + dataset.data[tooltipItem.index].toLocaleString()  + " " + suffix
			);

Environment

  • Chart.js version: “chart.js”: “^2.9.4”
  • Browser name and version: Chrome Version 86.0.4240.80 (Offizieller Build) (x86_64)

Am I doing something wrong ?

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:5 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
zibouscommented, Oct 21, 2020

@etimberg

Chart.defaults.doughnut.tooltips.callbacks.label = overrideFunction;

Thanks, now it is working, perfect 👍

1reaction
etimbergcommented, Oct 21, 2020

You should be able to override the defaults for the other chart types with something like the following. You would need to override it for the 'bubble', 'doughnut', 'pie', 'polarArea', and 'scatter' chart types.

Chart.defaults.doughnut.tooltips.callbacks.label = overrideFunction;
Read more comments on GitHub >

github_iconTop Results From Across the Web

Tooltip - Chart.js
Tooltip Configuration. Namespace: options.plugins.tooltip , the global options for the chart tooltips is defined in Chart.defaults.plugins.
Read more >
Chart.js V2: Add prefix or suffix to tooltip label - Stack Overflow
There is a sample for the usage of callbacks here and you can find the possible callbacks in the documentation under Chart.defaults.global.tooltips.
Read more >
Tooltips | Charts - Google Developers
In this documentation, you'll learn how to create and customize tooltips in Google Charts. Specifying the tooltip type. Google Charts automatically creates ...
Read more >
Chart Configuration - Qiao
Chart.js merges the options object passed to the chart with the global configuration using chart type defaults and scales defaults appropriately.
Read more >
How to Show the Labels in the Customize Tooltip in Chart JS
To do this we need to use the callbacks function for the tooltip. ... With chart js you can make line chart, bar...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found