How to limit the number of characters in axis labels on the X-axis

How to limit the number of characters in axis labels on the X-axis

Posted by: dung.itcdt on 23 October 2024, 6:18 am EST

• 

  dung.itcdt

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 23 October 2024, 6:18 am EST

  Hi, I’m working with a FlexChart control v4.8 and need to restrict the character count displayed on the X-axis. I’ve attempted to use the Formatter assigned to AxisX, but the Format function isn’t being invoked. I’ve also experimented with the CustomLabels property, however, word wrapping isn’t functioning as expected. Are there any alternative approaches I could take?

  Best regards

• 

  uttkarsh.matiyal

  

  • Post Options:
  • Link
    Copy

  Posted 24 October 2024, 4:54 am EST

  Hello,

  FYI, the Formatter property does not work if Axis’s labels are of string type. If you have string values in the Axis then you can implement custom labels in the following two ways:

  1. Using the DataSource property of the Axis: You can pass an array of strings (labels you want to display) in this property. [Refer to the attached sample.]
  2. Using an extra property in the data point: You can initialize an extra property in the datapoint to return the formatted values of the axis. [Comment line no. 33 in the sample]

  Sample: FlexChart_CustomLabels.zip

  Regards,
  
  Uttkarsh.

• 

  dung.itcdt

  • Post Options:
  • Link
    Copy

  Posted 24 October 2024, 5:04 am EST

  Hello,
  
  I’ve tried trimming the string right from the DataSource, but when I hover over a column and display a tooltip, I want my tooltip to show the untrimmed value.
  
  I’m currently declaring Tooltip.Content = “{seriesName}\nX = {x}\nY = {value:N0}”"

  Regards

• 

  uttkarsh.matiyal

  

  • Post Options:
  • Link
    Copy

  Posted 25 October 2024, 12:32 am EST

  Hello,

  So, you are tweeking your data source. Then you can keep your main AxisX binding as it is and create a new property for the trimmed values. Use the new property to bind with the AxisX to display trimmed values, and use the main property to display the tooltip.
  
  Refer to the attached modified sample for the same: FlexChart_CustomLabels_Mod.zip

  Regards,
  
  Uttkarsh.

• 

  dung.itcdt

  • Post Options:
  • Link
    Copy

  Posted 30 October 2024, 8:41 pm EST

  Thanks for the suggestion. I’ll give it a shot and let you know if anything comes up.

  Regards