score:1
Accepted answer
you can do this with a tooltip label callback.
the following runnable code snippet (derived from https://www.chartjs.org/docs/latest/charts/bar.html) rounds the value in the tooltip to two decimal places and always displays two decimal digits.
new chart(document.getelementbyid("mychart"), {
"type": "bar",
"data": {
"labels": ["january", "february", "march", "april", "may", "june", "july"],
"datasets": [{
"label": "my dataset",
"data": [65.11, 59.1, 80, 81.8, 56.577, 55.8477, 40],
"fill": false,
"backgroundcolor": ["rgba(255, 99, 132, 0.2)", "rgba(255, 159, 64, 0.2)", "rgba(255, 205, 86, 0.2)", "rgba(75, 192, 192, 0.2)", "rgba(54, 162, 235, 0.2)", "rgba(153, 102, 255, 0.2)", "rgba(201, 203, 207, 0.2)"],
"bordercolor": ["rgb(255, 99, 132)", "rgb(255, 159, 64)", "rgb(255, 205, 86)", "rgb(75, 192, 192)", "rgb(54, 162, 235)", "rgb(153, 102, 255)", "rgb(201, 203, 207)"],
"borderwidth": 1
}]
},
"options": {
"tooltips": {
callbacks: {
label: (tooltipitem, data) => {
var label = data.datasets[tooltipitem.datasetindex].label || '';
return label + ' ' + (math.round(tooltipitem.ylabel * 100) / 100).tofixed(2);
}
}
},
"scales": {
"yaxes": [{
"ticks": {
"beginatzero": true
}
}]
}
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/chart.js/2.9.3/chart.min.js"></script>
<canvas id="mychart" height="100"></canvas>
Source: stackoverflow.com
Related Query
- Chartjs is stripping trailing zeros in decimal datasets
- Skip decimal points on y-axis in chartJS
- Chartjs cannot read property datasets of undefined
- ChartJS - Line Chart with different size datasets
- Chartjs - show elements in all datasets on hover using bar chart
- Chartjs Datasets overlapping and z-index
- Chartjs : data labels getting overlapped in smaller datasets using chartjs-plugin-datalabels
- ChartJs Doughnut parsing datasets
- How to add ChartJS code in Html2Pdf to view image
- ChartJS unique datasets per label
- Multiple bubble chart datasets for chartjs
- How do I add time sourced from an external source as an X axis to a ChartJS graph?
- Chartjs not working with d3 from csv source
- ChartJS datasets with one data value
- ChartJS update chart with multiple datasets
- ChartJs - Round borders on a doughnut chart with multiple datasets
- chartjs undefined length when using 2 datasets
- Map through datasets in chartjs
- How to generate colors for unknown number of datasets in Chartjs
- Graphs sharing datasets in chartjs
- ChartJS have xAxes labels match data source
- How do I display two datasets on a single chart with chartjs
- Updating Chartjs to 2.5 with custom code
- chartjs how to change decimal to integers X-axis
- Adding an additional datasets to chartJS
- React Chartjs 2 display axes above datasets backgroundColor
- ChartJS hover/tooltips: selecting the correct points in the datasets based on x-value
- Chartjs 2 Line Graph Single Stroke Between Datasets
- Chartjs different length of labels and datasets
- Calling data from outside of Chartjs code
More Query from same tag
- How to make dashed thick lines with dots in ChartJS ? Is it possible?
- vb.net string to chartjs data field?
- How do I use this new extension for chart.js?
- chart.js: How do I make the radar chart axis labels bigger?
- Angular 8: Creating a custom horizontal bar chart
- Chart.js add direction arrows to the X and Y axes
- Resize chart.js canvas for printing
- Execute script after loading server side rendered React component
- Trying to export chart with Chartjs and React but getting erorr
- $scope variable not updating when factory object changes AngularJS
- ChartJS - legends and tooltips options
- Chart.js v2 - combined stacked bar chart and 2 unstacked lines
- How to pass an array to chart.js data:[] while creating a chart in php
- Drawing pie segment percentage in middle of doughnut with chartjs issue
- Not able to pass array of data to chart.js in React
- Module not found: Can't resolve 'chart.js/auto
- How to change the Chart.js legend rectangles to squares
- How to write the value over each bullet in small div permanently in chart js
- Count up values in Chart JS
- Trying to get _index of clicked bar in ChartJS
- Chart.js - tooltiptemplate with one decimal value in pie chart
- Chartjs inner separation
- Add watermark/logo to Chart.js
- How do I make a pie chart showing number of people in an age group with JSON and ChartJS?
- How to use plugin in chartjs-node?
- Chart.js dynamic bar width
- How to add conditional logic on Chart.js config?
- JavaScript Chart.JS - issue keeping charts in two rows, instead everything in stacked into one column
- Chart js cut the title and the legends
- Execute 'onscroll' function only once