different name and tooltip on chart

I have this problem where my charts (vaadin charts) has a legend with very long names (both line and pie charts)
I wish to show only a shortcut of this name and show the fullname on the tooltip.
so far I couldn’t find a way to do that ,

Appriciate your help.

I can think of more than one alternative, the simplest one would be to directly truncate the legend label.
To do so you can add a function in the Legend’s LabelFormatter.

Configuration conf = chart.getConfiguration(); conf.getLegend().setLabelFormatter("function () {" + " if(this.name.length>10){" + " return this.name.slice(0,8)+'...';" + " }else{" + " return this.name;" + " }" + "}"); Something similar could be done in Tooltip’s Formatter.

The used functions can be as complex as you want and could do some mapping between long and short name, unluckily it’s not so easy as it’s plain javascript in a string field.

Another option that would work for the Pie chart (as they use the name of the data point) would be as I explained in
this forum post
where you add a custom property to the point and then use it in the formatter. In the case of the line chart you’d need a custom property in the data series instead of in the point.

Hope this helps,


Thank you very much ! I’ll try it out


Thank you so much !!

Great to hear that!