如何在charts.js的饼图工具提示中添加千位分隔符



我需要在饼图工具提示中添加千个分隔符,我曾尝试添加 multiTooltipTemplate : function(label){return label.datasetLabel + ': ' + label.value.toString().replace(/B(?=(d{3})+(?!d))/g, ".");} 进入我的代码,但它不起作用。这是我的完整代码:

var pieChartCanvas = $('#pieChart').get(0).getContext('2d')
var pieChart       = new Chart(pieChartCanvas)
var PieData        = <?php echo json_encode($pasar2); ?>;
var pieOptions     = {
multiTooltipTemplate : function(label){return label.datasetLabel + ': ' + label.value.toString().replace(/B(?=(d{3})+(?!d))/g, ".");},
//Boolean - Whether we should show a stroke on each segment
segmentShowStroke    : true,
//String - The colour of each segment stroke
segmentStrokeColor   : '#fff',
//Number - The width of each segment stroke
segmentStrokeWidth   : 2,
//Number - The percentage of the chart that we cut out of the middle
percentageInnerCutout: 10, // This is 0 for Pie charts
//Number - Amount of animation steps
animationSteps       : 100,
//String - Animation easing effect
animationEasing      : 'easeOutBounce',
//Boolean - Whether we animate the rotation of the Doughnut
animateRotate        : true,
//Boolean - Whether we animate scaling the Doughnut from the centre
animateScale         : false,
//Boolean - whether to make the chart responsive to window resizing
responsive           : true,
// Boolean - whether to maintain the starting aspect ratio or not when responsive, if set to false, will take up entire container
maintainAspectRatio  : true,
//String - A legend template
legendTemplate       : '<ul class="<%=name.toLowerCase()%>-legend"><% for (var i=0; i<segments.length; i++){%><li><span style="background-color:<%=segments[i].fillColor%>"></span><%if(segments[i].label){%><%=segments[i].label%><%}%></li><%}%></ul>'
}
//Create pie or douhnut chart
// You can switch between pie and douhnut using the method below.
pieChart.Doughnut(PieData, pieOptions)

试试这个:

function(label){
//Assuming the label.value is a number
let amount = label.value.toFixed(2);
let tooltipLabel =  label.datasetLabel + ': ' + amount.replace(/(d)(?=(d{3})+(?!d))/g, "$1,");
return tooltipLabel; 
}

最新更新