How to display tooltip with Date in Calendar Heatmap

[Hugo Zhao]

Like this, Thank you

[Sharon Sanchez Selvaraj]

Hi Hugo, 

Thanks for contacting Syncfusion Support. 

We have checked with your query. The given scenario can be achieved using TooltipRendering event. 

Refer to the following code snippet. 

public void TooltipRendering(ITooltipEventArgs args) 

    { 

        var year = args.XValue; 

        var x = args.XValue.ToString(); 

        String[] date = x.Split(" "); 

        String[] xValue = date[0].Split("/"); 

        args.Content = new string[] { xValue[2] + "-" + xValue[0] + "-" + xValue[1] + " | " + args.YLabel + " : " + args.Value }; 

    } 

We have created a sample here for your reference. 

https://www.syncfusion.com/downloads/support/directtrac/general/ze/HeatMap_Tooltip_Rendering-384297306.zip 

Please check with the below links to know more about HeatMap component. 

Demo: https://blazor.syncfusion.com/demos/heatmap-chart/default-functionalities?theme=bootstrap4 

Documentation: https://blazor.syncfusion.com/documentation/heatmap-chart/getting-started/ 

API: https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.HeatMap.SfHeatMap.html 

Please let us know if you need further assistance.  

Regards, 

Sharon Sanchez S. 

[Hugo Zhao]

Hi Sharon,

Thank you very much, but there is a problem with your demo, the same column all share the same date.

[Sharon Sanchez Selvaraj]

Hi Hugo, 

We have checked with your reported issue and we were able to replicate it in our end. We have considered this as a bug and the fix for this will be included in the third weekly patch release after Volume 1, 2021 release which is expected to be rolled out by the end of March 2021. 

Please track the below feedback to know the status of the issue. 

https://www.syncfusion.com/feedback/23301/datetime-value-not-proper-when-receiving-through-args-value-in-calendar-heatmap 

We appreciate your patience. 

Regards, 

Sharon Sanchez S. 

[Keerthana Rajendran]

Hi Hugo, 

 

In Volume 2 Main Release v19.2.0.44, we have included the fix for the issue “DateTime value is not properly updated in the tooltip event argument of Heatmap component”.  To access this fix, we suggest you update the package to the 19.2 or latest version. 

 

Sample link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/Heatmap544830182.zip 

 

We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance. 

 

Regards, 

Keerthana.