amcharts / amcharts5

The newest, fastest, and most advanced amCharts charting library for JavaScript and TypeScript apps.
Other
349 stars 92 forks source link

number formatter prefix for legend #1764

Open flaming-cl opened 6 days ago

flaming-cl commented 6 days ago

hey, would you please let us know how to dynamically add number formatter prefix for the legend values? assume my values are

USD $1,000, GBP £2,000, EUR €3,000

data: [
            { currency: "$", country: 'U', sales: 1000 },
            { currency: "£", country: 'G', sales: 2000 }, 
            { country: '€', country: 'E', sales: 3000 }
          ]
Screenshot 2024-10-15 at 10 14 41 PM
martynasma commented 6 days ago

You can set what is displayed in legend using legendLabelText and legendValueText.

Docs: https://www.amcharts.com/docs/v5/charts/percent-charts/legend-percent-series/#Setting_content

E.g.:

var series = chart.series.push(
  am5percent.PieSeries.new(root, {
    name: "Series",
    valueField: "sales",
    categoryField: "country",
    legendValueText: "{currency}{valuePercentTotal.formatNumber('0.00p')}"
  })
);
flaming-cl commented 1 day ago

https://www.amcharts.com/docs/v5/charts/percent-charts/legend-percent-series/#Setting_content

Thanks @martynasma! btw, possible to include an external variable for legendValueText?

e.g.

{
legendValueText: `${someExternalVariable}{valuePercentTotal.formatNumber('0.00p')}`
}
martynasma commented 1 day ago

Yes, you can include external value using ${yyy} notation. Or if you want to reference to a key in data you can use just curly brackets {customValueFromData}.