DateFormat in Tooltip

Flow
1

HI everyone,

I am trying to display the start end endtime in a tooltip. It worked with Vaadin 13 and this code:

tooltip.setFormatter(“this.series.name +‘: ‘+ Highcharts.dateFormat(’%H:%M’, this.point.low) + ’ - ’ + Highcharts.dateFormat(‘%H:%M’, this.point.high)”);

But as i changed to Vaadin 14, Highcharts throws an error. How do I do this in vaadin 14?

Patrick

2

Hi all,

I figured a way to show the time with the tooltip. Maybe not the best, but it works.

    String htmlFuncMiliToTime = "function msToTime(s) { " +
    		"var ms = s % 1000;" + 
    		"s = (s - ms) / 1000;" + 
    		"var secs = s % 60;" + 
    		"s = (s - secs) / 60;" + 
    		"var mins = s % 60;" + 
    		"s = (s - mins) / 60;" +
    		"var hrs = s % 24;" +
    		"var formattedMins = ('0' + mins).slice(-2);"+ 
     		"var formattedHrs = ('0' + hrs).slice(-2);"+ 
    		"  return formattedHrs + ':' + formattedMins ;}";
    
    tooltip.setFormatter("(function() { "
    		+	htmlFuncMiliToTime  
    		+ "var time = msToTime(this.point.low);"
    		+ "var time2 =  msToTime(this.point.high);"
    		+ "return this.point.id + ': ' + time + ' - ' + time2;})");