This is a migrated thread and some comments may be shown as answers.

How can Xaxis label format display changes freq based on data

8 Answers 118 Views

Chart

This is a migrated thread and some comments may be shown as answers.

8 Answers, 1 is accepted

answered on 30 Mar 2011, 09:06 AM

Hi siva,

Basically, once can add tickpoints to the axis. The code may look like this:

private void Button_Click(object sender, RoutedEventArgs e)
{
TickPoint point = new TickPoint();
point.Label = "Manually Added";
RadChart1.DefaultView.ChartArea.AxisX.TickPoints.Add(point);
}

However, this is not the recommended approach - this would simply add a tickpoint, without persisting it, or sizing the axis properly. If one would like to customize the axis, you can toggle off its auto ranging, and set the min and max values, as well as the step.
Another option is to customize the axis labels via a converter. The tipic below elaborates on the matter.

Customizing Axis Labels via a converter
There are cases when the standard format strings for the Chart may fall short in meeting a particular format behavior. In such scenarios, as well as in cases when one wants to have more complete control on a per label basis, one can take the following approach:

1.1. retemplate the AxisLabel2D, which is the type for the labels along both the x and y axis.

<Style

TargetType="telerik:AxisLabel2D">

<Setter Property="HorizontalAlignment" Value="Stretch" />

<Setter Property="VerticalAlignment" Value="Top" />

<Setter Property="ItemLabelStyle">

<Setter.Value>

<Style TargetType="TextBlock">

<Setter Property="TextAlignment" Value="Center" />

<Setter Property="Padding" Value="1" />

</Style>

</Setter.Value>

</Setter>

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="telerik:AxisLabel2D">

<?SILVERLIGHT BEGIN?>

<primitives:LayoutTransformControl x:Name="PART_LayoutTransformControl" VerticalAlignment="{TemplateBinding VerticalAlignment}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}"> <primitives:LayoutTransformControl.Content>

<TextBlock Style="{TemplateBinding ItemLabelStyle}"

Text="{Binding Converter={StaticResource DateConverter}}" /> </primitives:LayoutTransformControl.Content>

<primitives:LayoutTransformControl.LayoutTransform>

<RotateTransform x:Name="PART_RotateTransform" />

</primitives:LayoutTransformControl.LayoutTransform> </primitives:LayoutTransformControl>

<?SILVERLIGHT END?>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

Essentially, the most important piece of the logic here are the TextBlock, and the correlated converter which determines the text which will be rendered at the label(s):

<TextBlock Style="{TemplateBinding ItemLabelStyle}"
       Text="{Binding Converter={StaticResource DateConverter}}" />                            </primitives:LayoutTransformControl.Content>

1,2. set a DefaultLabelFormat for the axis which will be customized. This default format will be used in the converter, to differentiate between the labels along the x and y axis. This may look something like this:

Chart1.DefaultView.ChartArea.AxisY.DefaultLabelFormat = "CustomYFormat";

1.3. include the actual converter in the code-behind:

public class DateConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            string returnValue;
            TickPoint tickPoint = value as TickPoint;
            if ((value as TickPoint).LabelFormat == "CustomYFormat" && (value as TickPoint).Value.ToString().Length>3 )                            {
                returnValue = (value as TickPoint).Value.ToString().Substring(0, 3) + "Custom text";
               }
            else
            {
                returnValue = (value as TickPoint).Value.ToString(); ;
            }

            return returnValue;
        }
        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            string strValue = value as string;
            DateTime resultDateTime;
            if (DateTime.TryParse(strValue, out resultDateTime))
            {
                return resultDateTime;
            }
            return DependencyProperty.UnsetValue;
        }

}

1.4. Include the converted in the resources section on the page:

<converter:DateConverter x:Key="DateConverter">
</converter:DateConverter>

I hope this information helps.

Kind regards,
Yavor
the Telerik team

Vote for the 7 Telerik products at the 2011 Great Indian Developer Awards!

answered on 01 Apr 2011, 09:01 AM

Hello siva,

If you are looking to alter the Silverlight chart labels in a manner similar to the approach for the winforms control, this is possible, however I would recommend that you stick with the previous approach which I elaborated on - it is more flexible, and still gives access to all labels along the axis. On the other hand, the approach for the Silverlight chart is not transferable to the winforms control. As shown in the topic, you can dynamically visit each label, and set the text accordingly. I hope this information helps.

Kind regards,
Yavor
the Telerik team

Vote for the 7 Telerik products at the 2011 Great Indian Developer Awards!