如何更改工具提示charJS中的值

问题描述 投票:0回答:1

我使用 LightningWebCharts,这里是文档链接 https://salesforcelabs.github.io/LightningWebChartJS/

我想在工具提示值中添加“k”。工具提示文档 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')
        
    }

是否可以在工具提示值中添加“k”?当我用“k”来控制台它的显示值时。但它没有显示在工具提示中。我需要返回回调对象吗?但我不知道该怎么做。

在此输入图片描述

charts chart.js salesforce bar-chart lwc
1个回答
0
投票

在您发布的代码中,您有

<c-tooltip enabled="true" filter={myCustomTooltipFunction}></c-tooltip>

但是文档

filter
用于仅选择工具提示的某些项目,而应该用于更改标签的函数是
labelCallback
,所以它应该是:

<c-tooltip enabled="true" labelCallback={myCustomTooltipFunction}></c-tooltip>

该文档还包括使用该函数的示例,请参阅此链接

© www.soinside.com 2019 - 2024. All rights reserved.