Chart js money formatting

Answer to https://stackoverflow.com/questions/56897990/how-to-make-money-format-in-chart-js-in-javascript/56898271#56898271

by Paweł Kapalla

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.js"></script>
<canvas id="app"></canvas>

CSS

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

#app {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  transition: all 0.2s;
  text-align: center;
}

TypeScript

let myLabels = []; //For label
let myDataset = []; //for money label
var ctx = document.getElementById("app").getContext('2d');

const formatter = new Intl.NumberFormat('en-US', {
	style: 'currency',
	currency: 'USD',
});
var myChart = new Chart(ctx, {
	type: 'bar',
	data: {
		labels: ['A', 'B', 'C', 'D', 'E', 'F'],
		datasets: [{
			label: 'Sales Store',
			data: [1267342, 19657612, 36765873, 55332532, 24776683, 36566],
			///data: myDataset,
			backgroundColor: [
				'rgba(255, 99, 132, 0.2)',
				'rgba(54, 162, 235, 0.2)',
				'rgba(255, 206, 86, 0.2)',
				'rgba(75, 192, 192, 0.2)',
				'rgba(153, 102, 255, 0.2)',
				'rgba(255, 159, 64, 0.2)',
				'rgba(255, 99, 132, 0.2)',
				'rgba(54, 162, 235, 0.2)',
				'rgba(255, 206, 86, 0.2)',
				'rgba(75, 192, 192, 0.2)',
				'rgba(153, 102, 255, 0.2)',
				'rgba(255, 159, 64, 0.2)'
			],
			borderColor: [
				'rgba(255,99,132,1)',
				'rgba(54, 162, 235, 1)',
				'rgba(255, 206, 86, 1)',
				'rgba(75, 192, 192, 1)',
				'rgba(153, 102, 255, 1)',
				'rgba(255, 159, 64, 1)',
				'rgba(255, 159, 64, 1)',
				'rgba(255, 159, 64, 1)',
				'rgba(255, 159, 64, 1)',
				'rgba(255, 159, 64, 1)',
				'rgba(255, 159, 64, 1)',
				'rgba(255, 159, 64, 1)'
			],
			borderWidth: 1
		}]
	},
	options: {
		tooltips: {
			callbacks: {
				label: function(tooltipItem, data) {
					return formatter.format(tooltipItem.yLabel);
				},
			},
		},
		scales: {
			yAxes: [{
				ticks: {
					beginAtZero:false
				}
			}]
		}
	}
});