Charts 2.0 Labels formatter completely broken?


Has anyone had any luck with setting the formatter property for the Labels for any chart type?
I tried for several chart types including Heatmap, and it doesn’t work.

Even setting what is documented as the default doesn’t work:

labels.setFormatter("function(){ return this.value; }");

It seems that this.value is undefined here. I also wanted to define a formatter function in a separate javascript file, loaded with @JavaScript on the component, as e.g. window.myformatter. But then this turned out to be undefined as well from within the function set by setFormatter, even though I could see (using the console in Chrome) that window.myformatter was set.
This feature works fine in HighCharts so it must be a Vaadin Charts issue.

Does anyone have a workaround for this?

Is there perhaps a way to get to the chart object from javascript, so that I can set the correct formatting function using a javascript function after the chart is loaded?


Herman Bovens


It looks like javadoc for Labels.setFormatter is a little missleading.

This is the available data in datalabel formatter function:

  • this.percentage Stacked series and pies only. The point’s percentage of the total.
  • this.point The point object. The point name, if defined, is available through
  • this.series: The series object. The series name is available through
  • Stacked series only. The total value at this point’s x value.
  • this.x: The x value.
  • this.y: The y value.

Regarding the external js function I’ll try to test it.