Im using LightningWebCharts here is the documentation link https://salesforcelabs.github.io/LightningWebChartJS/
I want add 'k' in tooltip value. Tooltip documentation https://salesforcelabs.github.io/LightningWebChartJS/docs/api/attributes/tooltip.html
<c-chart type="bar" responsive="true">
<c-dataset labels='["Item 1","Item 2","Item 3","Item 4", "Item 5","Item 6","Item 7"]'>
<c-data label="Neutral" detail='[10,20,30,40]' backgroundcolor='rgba(50, 150, 237, 1)' stack="1" ></c-data>
<c-data label="Warning" detail='[10,20,30","40"]' backgroundcolor='rgba(119, 185, 242, 1)' stack="1"></c-data>
<c-data label="Error" detail='["10","20","30","40"]' backgroundcolor='rgba(157, 83, 242, 1)' stack="1"></c-data>
</c-dataset>
<c-cartesian-axis axis="x" stacked="true" >
</c-cartesian-axis>
<c-cartesian-axis axis="y" stacked="true"></c-cartesian-axis>
<c-tooltip enabled="true" filter={myCustomTooltipFunction}></c-tooltip>
</c-chart>
myCustomTooltipFunction(tooltipItems){
console.log('called',JSON.stringify(tooltipItems))
console.log(tooltipItems.value+'k')
return (tooltipItems.value+'k')
}
Is it possible to add 'k' in tooltip value? when i console its showing value with 'k'. But its not showing in tooltip. Shall i need to return callback object? But im not sure how to do.
In the code you posted, you have
<c-tooltip enabled="true" filter={myCustomTooltipFunction}></c-tooltip>
but the documentation says that filter
is used to select only some of items of the tooltip, while the function that should be used to change the label is labelCallback
, so it should be:
<c-tooltip enabled="true" labelCallback={myCustomTooltipFunction}></c-tooltip>
The documentation also includes an example of that function being used, see this link.