Help needed with labels and ticks

[Pete Davis]

I'm doing a candlestick chart and the dates are overlapping when I do a short range (say a week). I'd like to rotate the labels 90 degrees. And because the date ranges are dynamic, I'd like the x axis to adapt so that it shows appropriate intervals, depending on the date range. unfortunately, I can't seem to do anything with the x axis. Example:

<telerik:ChartDefaultView>
    <telerik:ChartDefaultView.ChartArea>
        <telerik:ChartArea>
            <telerik:ChartArea.AxisX>
                <telerik:AxisX LayoutMode="Between" IsDateTime="True" LabelRotationAngle="90" StepLabelLevelHeight="40" />
            </telerik:ChartArea.AxisX> 
        </telerik:ChartArea>
    </telerik:ChartDefaultView.ChartArea>
</telerik:ChartDefaultView>

The label does not rotate.

I'd try to set this stuff in the designer, but whenever I make changes to the X Axis in the designer, it crashes the designer.

[Missing User]

Hi Pete Davis,

We are unsure why you are experiencing problems with the label rotation -- it behaves as expected in our local tests (see the attached sample application).

Also, the current version of RadChart provides various means for resolving the axis item label overlapping issues but it does not provide automatic built-in algorithm that can choose the best settings for each scenario (rotated labels, visualizing every n-th label through the AxisX.LabelStep property, or displaying the labels in several rows through the AxisX.StepLabelLevelCount property).

In order to achieve this functionality you need to use the provided RadChart features and manually set them up as per your specific scenario. Please, review our AxisFeatures demo, where you can find information how to implement labels rotation. You can also review this help topic.

I hope this helps.


All the best,

Polina

the Telerik team

[Pete Davis]

Well, here's my entire XAML for the rad chart. I'm not doing anything in the code.

<telerik:RadChart Name="radChart1" ItemsSource="{Binding ChartData}" Height="300">
    <telerik:RadChart.AnimationSettings>
        <telerik:AnimationSettings DefaultSeriesDelay="00:00:00" ItemAnimationDuration="00:00:00" ItemDelay="00:00:00" />
    </telerik:RadChart.AnimationSettings>
    <telerik:ChartDefaultView>
        <telerik:ChartDefaultView.ChartLegend>
            <telerik:ChartLegend IsEnabled="True" Visibility="Hidden" />
        </telerik:ChartDefaultView.ChartLegend>
        <telerik:ChartDefaultView.ChartArea>
            <telerik:ChartArea>
                <telerik:ChartArea.AxisX>
                    <telerik:AxisX LayoutMode="Between" IsDateTime="True" LabelRotationAngle="90" StepLabelLevelHeight="40" />
                </telerik:ChartArea.AxisX>
            </telerik:ChartArea>
        </telerik:ChartDefaultView.ChartArea>
    </telerik:ChartDefaultView>
    <telerik:RadChart.SeriesMappings>
        <telerik:SeriesMapping>
            <telerik:SeriesMapping.SeriesDefinition>
                <telerik:CandleStickSeriesDefinition />
            </telerik:SeriesMapping.SeriesDefinition>
            <telerik:SeriesMapping.ItemMappings>
                <telerik:ItemMapping DataPointMember="Open"
                                FieldName="OpenPrice" />
                <telerik:ItemMapping DataPointMember="High"
                                FieldName="HighPrice" />
                <telerik:ItemMapping DataPointMember="Low"
                                FieldName="LowPrice" />
                <telerik:ItemMapping DataPointMember="Close"
                                FieldName="ClosePrice" />
                <telerik:ItemMapping DataPointMember="XValue"
                                FieldName="QuoteDate" />
            </telerik:SeriesMapping.ItemMappings>
        </telerik:SeriesMapping>
    </telerik:RadChart.SeriesMappings>
</telerik:RadChart>

Also, for some reason, the Legend is now displaying as well, so something isn't right. This might be easier if I could do this stuff in the designer, but it keeps throwing exceptions in the designer. Honestly, I'm starting to think the RadChart just isn't going to work for my needs.

[Missing User]

Hi Pete Davis,

We are able to reproduce the problematic behavior after removing the DefaultView declaration in the xaml file and trying to set axes properties from the designer. This issue is already forwarded to our developers for further investigation. As a workaround you can declare the DefaultView in the xaml file before changing properties in the designer. For your convenience, I attached a sample runnable project, which demonstrates the RadChart setup, so that the problematic behavior is avoided, and example how to rotate the axis labels.

As I mentioned in the previous post, RadChart does not provide an automatic built-in algorithm that can choose the best settings for each label positioning scenario. In order to achieve the desired functionality you need to use the provided RadChart features and manually set them up as per your specific scenario.

I hope this helps.

Greetings,

Polina

the Telerik team