C1FlexChart - how to set font style for Axis

C1FlexChart - how to set font style for Axis

Posted by: digiptechnologies on 18 June 2019, 12:27 am EST

• 

  digiptechnologies

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 18 June 2019, 12:27 am EST - Updated 4 October 2022, 12:05 am EST

  Hello,

  How can we set the font style for the labels of Axises? Please refer to the attached image.

  

  1232×530 43.3 KB

  Thanks,
  
  Parthiv

• 

  Ruchir.Agarwal

  

  • Post Options:
  • Link
    Copy

  Posted 18 June 2019, 3:04 pm EST

  Hi Parthiv,

  FlexChart allows customizing the appearance for entire chart as well as its individual elements like Axis labels and Axis Titles.
  
  For this, just access the specific element (like AxisX, AxisY etc) in FlexChart and set its Style property, as follows:```
  
  ChartStyle stylAxisX = new ChartStyle();
  
  stylAxisX.FontSize = 14;
  
  stylAxisX.FontStyle= FontStyles.Italic;
  
  flexChart.AxisX.Style = stylAxisX;

  ChartStyle stylAxisY = new ChartStyle();
  
  stylAxisY.FontSize = 14;
  
  stylAxisY.FontStyle = FontStyles.Oblique;
  
  flexChart.AxisY.Style = stylAxisY;
  
  

  Also, to change the FontStyle for Axis's Title, you should look for out for properties like [i]AxisX.TitleStyle[/i], [i]AxisY.TitleStyle[/i] etc and set them as above.

  
  
  ChartStyle stylAxisXTtl = new ChartStyle();
  
  stylAxisXTtl.FontSize = 18;
  
  stylAxisXTtl.FontStyle = FontStyles.Italic;
  
  flexChart.AxisX.TitleStyle = stylAxisXTtl;

  
  Warm regards,
  Ruchir

• 

  digiptechnologies

  • Post Options:
  • Link
    Copy

  Posted 18 June 2019, 11:58 pm EST

  Hi Ruchir

  Thanks for the response. I also have one more question. How can we set all this property in XAML? Actually, I have a number of charts in a single view and do not want to write this style for all the charts. So wondering how can set this TitleStyle using XAML?

• 

  Ruchir.Agarwal

  

  • Post Options:
  • Link
    Copy

  Posted 20 June 2019, 12:22 am EST

  Hi,

  Yes, it is possible. Following is the code for the same:

  <c1:C1FlexChart.AxisY>
    <c1:Axis>
       <c1:Axis.TitleStyle>
             <c1:ChartStyle FontSize="18" FontStyle="Italic"/>
       </c1:Axis.TitleStyle>
    </c1:Axis>
  </c1:C1FlexChart.AxisY>
  <c1:C1FlexChart.AxisX>
       <c1:Axis>
            <c1:Axis.TitleStyle>
                 <c1:ChartStyle FontSize="18" FontStyle="Italic" FontWeight="SemiBold"/>
            </c1:Axis.TitleStyle>
       </c1:Axis>
  </c1:C1FlexChart.AxisX>
  ```Thanks,
  Ruchir