Showing axis labels

2 posts, 1 answers
  1. Alberto
    Alberto avatar
    26 posts
    Member since:
    Nov 2012

    Posted 02 Dec 2013 Link to this post

    Hello,

    I have a window where I need to show 6 charts and that window can change its size, as the window gets smaller, the labels on the horizontal axis start disappearing as you can see in the attached image.

    This is the a sample code:
    <Window
            xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation" x:Class="TestWPF2.MainWindow"
            Title="MainWindow" Height="443.5" Width="890.5" >
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
     
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="*" />           
            </Grid.ColumnDefinitions>
             
            <telerik:RadCartesianChart Margin="0,0,0,0" Grid.Row="0">
                <telerik:RadCartesianChart.HorizontalAxis>
                    <telerik:CategoricalAxis/>
                </telerik:RadCartesianChart.HorizontalAxis>
                <telerik:RadCartesianChart.VerticalAxis>
                    <telerik:LinearAxis/>
                </telerik:RadCartesianChart.VerticalAxis>
                <telerik:BarSeries>
                    <telerik:BarSeries.DataPoints>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="10" Value="10"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="20" Value="20"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="30" Value="30"/>
                    </telerik:BarSeries.DataPoints>
                </telerik:BarSeries>
            </telerik:RadCartesianChart>
     
            <telerik:RadCartesianChart Margin="0" Grid.Column="1" Grid.Row="0">
                <telerik:RadCartesianChart.HorizontalAxis>
                    <telerik:CategoricalAxis/>
                </telerik:RadCartesianChart.HorizontalAxis>
                <telerik:RadCartesianChart.VerticalAxis>
                    <telerik:LinearAxis/>
                </telerik:RadCartesianChart.VerticalAxis>
                <telerik:BarSeries>
                    <telerik:BarSeries.DataPoints>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="10" Value="10"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="20" Value="20"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="30" Value="30"/>
                    </telerik:BarSeries.DataPoints>
                </telerik:BarSeries>
            </telerik:RadCartesianChart>
     
            <telerik:RadCartesianChart Margin="0" Grid.Row="1">
                <telerik:RadCartesianChart.HorizontalAxis>
                    <telerik:CategoricalAxis/>
                </telerik:RadCartesianChart.HorizontalAxis>
                <telerik:RadCartesianChart.VerticalAxis>
                    <telerik:LinearAxis/>
                </telerik:RadCartesianChart.VerticalAxis>
                <telerik:BarSeries>
                    <telerik:BarSeries.DataPoints>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="10" Value="10"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="20" Value="20"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="30" Value="30"/>
                    </telerik:BarSeries.DataPoints>
                </telerik:BarSeries>
            </telerik:RadCartesianChart>
     
            <telerik:RadCartesianChart Margin="0" Grid.Column="1" Grid.Row="1">
                <telerik:RadCartesianChart.HorizontalAxis>
                    <telerik:CategoricalAxis/>
                </telerik:RadCartesianChart.HorizontalAxis>
                <telerik:RadCartesianChart.VerticalAxis>
                    <telerik:LinearAxis/>
                </telerik:RadCartesianChart.VerticalAxis>
                <telerik:BarSeries>
                    <telerik:BarSeries.DataPoints>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="10" Value="10"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="20" Value="20"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="30" Value="30"/>
                    </telerik:BarSeries.DataPoints>
                </telerik:BarSeries>
            </telerik:RadCartesianChart>
     
            <telerik:RadCartesianChart Margin="0" Grid.Row="2">
                <telerik:RadCartesianChart.HorizontalAxis>
                    <telerik:CategoricalAxis/>
                </telerik:RadCartesianChart.HorizontalAxis>
                <telerik:RadCartesianChart.VerticalAxis>
                    <telerik:LinearAxis/>
                </telerik:RadCartesianChart.VerticalAxis>
                <telerik:BarSeries>
                    <telerik:BarSeries.DataPoints>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="10" Value="10"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="20" Value="20"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="30" Value="30"/>
                    </telerik:BarSeries.DataPoints>
                </telerik:BarSeries>
            </telerik:RadCartesianChart>
     
            <telerik:RadCartesianChart Margin="0" Grid.Column="1" Grid.Row="2">
                <telerik:RadCartesianChart.HorizontalAxis>
                    <telerik:CategoricalAxis/>
                </telerik:RadCartesianChart.HorizontalAxis>
                <telerik:RadCartesianChart.VerticalAxis>
                    <telerik:LinearAxis/>
                </telerik:RadCartesianChart.VerticalAxis>
                <telerik:BarSeries>
                    <telerik:BarSeries.DataPoints>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="10" Value="10"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="20" Value="20"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="30" Value="30"/>
                    </telerik:BarSeries.DataPoints>
                </telerik:BarSeries>
            </telerik:RadCartesianChart>
     
            <telerik:RadCartesianChart Margin="0" Grid.Row="3">
                <telerik:RadCartesianChart.HorizontalAxis>
                    <telerik:CategoricalAxis/>
                </telerik:RadCartesianChart.HorizontalAxis>
                <telerik:RadCartesianChart.VerticalAxis>
                    <telerik:LinearAxis/>
                </telerik:RadCartesianChart.VerticalAxis>
                <telerik:BarSeries>
                    <telerik:BarSeries.DataPoints>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="10" Value="10"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="20" Value="20"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="30" Value="30"/>
                    </telerik:BarSeries.DataPoints>
                </telerik:BarSeries>
            </telerik:RadCartesianChart>
     
            <telerik:RadCartesianChart Margin="0" Grid.Column="1" Grid.Row="3">
                <telerik:RadCartesianChart.HorizontalAxis>
                    <telerik:CategoricalAxis/>
                </telerik:RadCartesianChart.HorizontalAxis>
                <telerik:RadCartesianChart.VerticalAxis>
                    <telerik:LinearAxis/>
                </telerik:RadCartesianChart.VerticalAxis>
                <telerik:BarSeries>
                    <telerik:BarSeries.DataPoints>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="10" Value="10"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="20" Value="20"/>
                        <telerik:CategoricalDataPoint Category="{x:Null}" IsSelected="False" Label="30" Value="30"/>
                    </telerik:BarSeries.DataPoints>
                </telerik:BarSeries>
            </telerik:RadCartesianChart>
             
             
        </Grid>
    </Window>

    Is there a way to avoid this behavior?

    Maybe make smaller the bars instead of disappearing the labels.

    Thanks in advance,

    Alberto




  2. Answer
    Petar Marchev
    Admin
    Petar Marchev avatar
    968 posts

    Posted 03 Dec 2013 Link to this post

    Hello Alberto,

    The default value of the MinHeight property of the RadCartesinaChart is 100. This is why the charts refuse to get smaller and in turn - some portion of the chart (the axis labels) get clipped. You can set the MinHeight property to a value that fits your scenario best.

    Regards,
    Petar Marchev
    Telerik
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  3. UI for WPF is Visual Studio 2017 Ready
Back to Top