score:2
Accepted answer
you can change the configuration for tooltip in options. in tooltip, we have callback object. in which, you set the title to a custom function that returns the title you want to give to the tooltip.
[sample-code]
var chartinstancehovermodenearest = new chart(ctx, {
type: 'bar',
data: data,
options:{
events:["click"],
title : {
display : true
},
scales: {
xaxes: [{
categoryspacing: 0
}]
},
tooltips: {
enabled: true,
callbacks : {
title : function(){
return "your custom title";
},
label : function(){
return "";
}
}
}
}
});
below are the methods in callback object. if you want to extend more you can override these methods to give custom functionality
callbacks : {
afterbody:(),
afterfooter:(),
afterlabel:(),
aftertitle:(),
beforebody:(),
beforefooter:(),
beforelabel:(),
beforetitle:(),
footer:(),
label:(tooltipitem, data),
labelcolor:(tooltipitem, chartinstance),
title:(tooltipitems, data)
}
Source: stackoverflow.com
Related Query
- Adjust appearance of tooltip in lien chart rendered by Chart.js
- How to print a chart rendered by code
- ChartJS New Lines '\n' in X axis Labels or Displaying More Information Around Chart or Tooltip with ChartJS V2
- Chart JS custom tooltip option?
- chart.js scatter chart - displaying label specific to point in tooltip
- show label in tooltip but not in x axis for chartjs line chart
- Chart.js doughnut chart tooltip size?
- ChartJS add tooltip to a grouped bar chart
- Chart JS Show HTML in Tooltip
- chart js tooltip how to control the data that show
- Show X axis on top and bottom in line chart rendered with Chart.js 2.4.0
- Chart js v2 tooltip callback line breaks
- Obtain max value of y axis of line chart rendered with Chart.js
- How to disable Chart JS tooltip when there is no value?
- Chart.js tooltip hover customization for mixed chart
- Add all data in the tooltip of Chart JS
- ng2-charts customize data and whole html content of tooltip displayed when hovering on bar chart
- Callback after line chart rendered
- Charts.js tooltip overlapping text on chart
- ChartJS: Show all labels of a mixed chart in the tooltip
- Chart.js line chart tooltip shows wrong label when line doesn't start at first label
- Chart JS custom tooltip not showing
- Chartjs - Insert additional data into chart tooltip
- Pie chart is not getting rendered in ChartJS
- Add a text as tooltip for each point on a line chart
- Primevue Chart not rendered
- ChartJS (React) Line Chart - How to show single tooltip with data and labels from 3 (multiple) dataset?
- Chart.js tooltip at any point on the chart
- Tooltip flickering when hovered on chart
- ChartJS version 3 how to add percentage to pie chart tooltip
More Query from same tag
- chart.js animation loading
- Getting chart.js to work with Django and Apache
- How can i retrieve and override presets chart.js option in angular selector?
- Changing line color below specific value in Chart.js
- Chartjs stacked bar single max value
- Chart.js Treemap Custom text
- How to Push data dynamically from firebase to bar graph in angular
- Problems displaying yLabels in charts.js
- Chart.js pie tooltip getting cut
- React-chartjs not working
- Chartjs, scatter with For-Loop
- How do I create multiple charts at the same page with angular?
- Old data flickering after hover on line graph Chart.js
- Chart js: bar width
- Chart.js wont display normal chart
- Parse HTML input value to php over javascript file
- ChartJS show gaps in time data
- How to set X coordinate for each bar with react chart js 2?
- Chart.js pie chart to display "No Data" if the datasets are empty
- How to add datas to chart js from my Array<number>? In Ionic3
- Chart.js Y axis label, reverse tooltip order, shorten X axis labels
- How to set subscript text in Chart.js axis title
- ChartJS: Change the positions of the tooltips
- Dollar sign on y-axis with ChartJS
- Separating list of data in Ajax
- Chart.js 2 - Always display only some tooltips in bubble chart
- ChartJS v2 - Keep tooltip open when user click on a point of a multiple lines chart
- Chartjs 2.5.0 -> Labels below the chart
- Prevent y-axis labels from being cut off
- Chart JS custom tooltip option?