Vaadin Charts - How to set Legend labelFormatter ?

Flow
1

Hi,

I am using Vaadin Charts Java API. Want to know How ot set Legend labelFormatter. We are trying to show the values as a part of Names displyed in the Legend.

I have attahced a sample here on What I am expecting
26401.png

2

Hi,

You can use either labelFormat or labelFormatter properties.

The first case would look like this:

conf.getLegend().setLabelFormat("{name} – ({y})"); The second case would look like this:

conf.getLegend().setLabelFormatter("this.name +' – ('+this.y+')'"); It looks more complex but allows you to also set a javascript function in case you need more complex computing.

In both cases don’t forget to enable showInLegend for the chart:

PlotOptionsPie plotOptions = new PlotOptionsPie(); plotOptions.setShowInLegend(true); conf.setPlotOptions(plotOptions); Hope this helps,

Guille

3

Hi Guille,

Thanks for the informaiton. I have tired it. But setLabelFormatter method not available in Legend. Please find the attachement.

Thanks,
Gokul
26409.png

4

What version of Vaadin Charts are you using? It is available in latest stable version 3.0.0.

5

Vaadin Charts 3.0 and newer versions have a much more complete API and provide an easier way to keep up to changes and new features coming from the underlying library. I would recommend you using this version.

There are some API changes you can check in the migration guide:
https://vaadin.com/docs/-/part/charts/java-api/charts-migration.html

In case you can’t use Charts 3 yet, one workaround would be to extend Legend class to add the missing properties:

[code]
/**

  • Extended legend with LabelFormat property
    */
    public class LegendWithLabelFormat extends Legend {
    private String labelFormat;
    private String _fn_labelFormatter;
    public LegendWithLabelFormat() {
    super();
    }
    public String getLabelFormat() {
    return labelFormat;
    }
    public void setLabelFormat(String labelFormat) {
    this.labelFormat = labelFormat;
    }
    public String getLabelFormatter() {
    return _fn_labelFormatter;
    }
    public void setLabelFormatter(String _fn_labelFormatter) {
    this._fn_labelFormatter = _fn_labelFormatter;
    }
    }
    [/code]Notice that formatter properties requires fn prefix.
    Then you can use it either this way:
LegendWithLabelFormat legend = new LegendWithLabelFormat();
legend.setLabelFormat("{name} – ({y})");
conf.setLegend(legend);

Or this way:

LegendWithLabelFormat legend = new LegendWithLabelFormat();
legend.setLabelFormatter("this.name +' – ('+this.y+')'");
conf.setLegend(legend);