We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Reduce font size on zoom out sfchart

Hi,PFB snapshot. On zooming out, the bar values do overlap. Hence, was wondering if the font size of the bar values can change based on the zoom factor. For eg, on zooming in, the bar value font size increases and on zoom out font size reduces to avoid overlap.2nd point : Also , is it possible to apply the same thing to x axis labels based on zoom factor..

3 Replies

PS Parthiban Sundaram Syncfusion Team June 15, 2017 12:48 PM UTC

Thanks for using Syncfusion products. 
You can set the angle for data marker labels and axis labels to overcome this overlapping issue. Please find the below code snippet. 
Code Example:  
series.DataMarker.LabelStyle.Angle = 270; 
xAxis.LabelRotationAngle = -45; 
We have also attached a sample for this. Please let us know if it doesn’t meet your requirement. 
Parthiban S

NC Naveen C Ramachandrappa June 16, 2017 08:40 PM UTC


I tried this and following is my finding.

xAxis.LabelRotationAngle = -45;  works fine but series.DataMarker.LabelStyle.Angle = 270;  is working only on WP and not on android. In android, it remains unchanged. Looks like the other styles on datamarker label is also not working.  I am using datamarker data template as well and also using datamarker label style.

Snapshots below.

Android :

Windows UWP:

PS Parthiban Sundaram Syncfusion Team June 19, 2017 10:24 AM UTC

Hi Naveen,

Thanks for the update.

We would like inform you that, DataMarker label style won’t work in datamarker template. However, based on your requirement we have achieved it in previous updated sample using Label content and Label Rotation Angle in default datamarker.

Please let us know, if you need further assistance on this.

Parthiban S

Live Chat Icon For mobile
Up arrow icon