score:2
Accepted answer
you are looking at the documentation of chart.js version 3 which has some major changes from version 2, if you take the version 2 docs: https://www.chartjs.org/docs/2.7.1/configuration/tooltip.html you can see that the property is called a bit different and also just accepts a string
working sample:
var ctx = document.getelementbyid('mychart').getcontext('2d');
var mychart = new chart(ctx, {
type: 'bubble',
data: {
datasets: [{
label: 'top',
data: [{
x: 110,
y: 0,
r: 10,
name: "performance"
}],
backgroundcolor: "rgba(153,255,51,0.6)"
},
{
label: 'average',
data: [{
x: 75,
y: 0,
r: 10,
name: "performance"
}],
backgroundcolor: "rgba(153,155,51,0.6)"
},
]
},
pointdot: true,
options: {
tooltips: {
footerfontstyle: 'normal',
callbacks: {
footer: function(tooltipitem, data) {
return 'some text'
}
}
},
}
});
<canvas id="mychart"></canvas>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chart.js/2.7.1/chart.bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels@0.2.0/dist/chartjs-plugin-datalabels.min.js"></script>
Source: stackoverflow.com
Related Query
- How to change font weight of footer in tooltips in Chart JS
- Chart js. How to change font styles for "labels" array?
- How to change React line chart tooltip title font family in chart.js
- How to change font size, padding of chart title only, in chart.js 3.x
- chartjs datalabels change font and color of text displaying inside pie chart
- How do I change the 'months' language displayed on the date axis in Chart JS?
- How to change Chart.js horizontal bar chart Width?
- How to change z-index of chart js tooltip?
- how to change default font family in react-chartjs-2
- How to change ChartJS font size with javascript?
- How to change the label and grid line position on a timeseries chart in Chart.js 3?
- How to change color of column in chart js
- How change chart height in chart.js
- angular-chart.js doughnut chart : How do I change width of the arc of a doughnut?
- How can I add a euro sign (€) to all tooltips in my chart js line chart
- How to change axis font in PrimeFaces and Chart.js
- How to change the chart line or area colors according to the user need?
- How to change background color of labels in line chart from chart.js?
- How to change default label of each bubble in bubble chart using chartjs-plugin-datalabels
- How to style a pie chart in chart js? I want to change the border color, border width and give them shadow
- How to change color by clicking on the chart bar?
- Chartjs - how to change the notation of doughnut chart
- How can I change the cursor on pie chart segment hover in ChartJS 3?
- How to destroy chart object in order to change chart data dynamically (Chart.js)?
- how to add Thousand separator in pie chart tooltips of charts.js
- How do I change the appearance of tooltips with mode: index in Chart.js
- How to change text colour of specific labels of axis in Chart JS?
- How to print a chart rendered by code
- Is there any way to change the font size of labels in bar chart in Chart.js v3?
- how to change point style legend to diamond in chart js
More Query from same tag
- Multiple axis line chart with Chart.js and JSON data from Google Sheet
- ChartJS Realtime Animation
- Chart.js and Firebase Ionic App Angular 4
- vue-chartjs load data from parent component
- chart.js and asynchronous loading
- Vue and Chartjs - Running a simple example of vue-chartjs
- How to trigger hover programmatically in chartjs
- how to add extra label at zero levels in x-axis in chartjs
- Chart.js - Increase space between y Axes and the first column bar
- Chartjs working with large and small values
- ChartJS: How to set fixed Y axis max and min
- How to make bootstrap 4 column height the same as row height
- How to add text inside scatter plot using Chart.js?
- Adding custom title in tooltips of chart.js
- chart.js dynamically set values of suggestedMin and suggestedMax based on values of array
- Chartjs is disappearing in Ionic tabs when keyboard dismiss
- ChartJs doesn't work on a local downloaded page of Circular Gauge chart example
- chartjs - json data for scatter graph, issue with date
- ChartJS v2: Scale value at click coordinates (time scale)
- How to add links to chart.js (Doughnut Charts)?
- Zoom and Pan in react-chartjs-2
- How to set the xAxes min and max values of time cartesian chart in Chart.js
- How to properly use the chartjs datalabels plugin
- Get Date Range with Given Date
- How to pass a dictionary to ChartJS?
- How can I add background color of length bars in chart (chartJS)?
- Vuejs, how to build an object?
- chartjs Asp.net MVC Remote Data
- Date selection not happening with a click in chartjs in the context of vuejs
- Why my buttons does not work?