Duplicate values on X-Axis

[Dominic]

If I zoom in to the chart I end up with multiple X-Axis ticks with duplicate values.

I have stepped through the LinearAxisModel code using Reflector and found that in the GenerateTicks method it has a ZoomWidth of ~50.0 and a MajorStep of 20.0.
Which over a range of min = 0, Max = 140 ends up with it generating far too many ticks for the data range.

Is there a way to control the number of ticks that are generated so that only one tick per distinct data value are displayed?

Thanks

[Rosko]

Hello Dominic,

There is a way depending on the axis you are using. Please, check the corresponding online help topic.

Regards,
Rosko
Telerik

[Dominic]

Hi,
I think the issue is that I dont want to start showing fractional values in the graph under different zoom levels.
Here is a very simple example.
Once I start to zoom the MajorStep value is forgotten about and I start getting values at 1.2, 1.4, 1.6 etc.
I dont want that. I just want it to stick with 1,2,3,4

 

public class ViewModel
   {

       public ObservableCollection<TenorDataPoint> DataPoints { get; set; }

       public ViewModel()
       {
           this.DataPoints = CreateTestData();
       }

       private ObservableCollection<TenorDataPoint> CreateTestData()
       {
           var list = new[]
                          {
                              new TenorDataPoint{TenorDate=DateTime.Today,Value = 1.0},
                              new TenorDataPoint{TenorDate=DateTime.Today.AddDays(1),Value = 2.0},
                              new TenorDataPoint{TenorDate=DateTime.Today.AddDays(2),Value = 3.0},
                              new TenorDataPoint{TenorDate=DateTime.Today.AddDays(3),Value = 4.0},
                              new TenorDataPoint{TenorDate=DateTime.Today.AddDays(4),Value = 5.0},
                              new TenorDataPoint{TenorDate=DateTime.Today.AddDays(5),Value = 6.0},
                              new TenorDataPoint{TenorDate=DateTime.Today.AddDays(6),Value = 7.0},
                              new TenorDataPoint{TenorDate=DateTime.Today.AddDays(7),Value = 8.0},
                              new TenorDataPoint{TenorDate=DateTime.Today.AddDays(8),Value = 9.0},
                              new TenorDataPoint{TenorDate=DateTime.Today.AddDays(9),Value = 10.0}
                          };

           return new ObservableCollection<TenorDataPoint>(list);
       }
   }

<Window x:Class="RadChartTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        xmlns:radChartTest="clr-namespace:RadChartTest"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>

        <radChartTest:ViewModel x:Key="TestModel"/>

    </Window.Resources>
    <Grid x:Name="Root" DataContext="{StaticResource TestModel}">
        <telerik:RadCartesianChart>
            <telerik:RadCartesianChart.Behaviors>
                <telerik:ChartPanAndZoomBehavior ZoomMode="Both" PanMode="Both"/>
            </telerik:RadCartesianChart.Behaviors>
            <telerik:ScatterLineSeries ItemsSource="{Binding DataPoints}" >
                <telerik:ScatterLineSeries.VerticalAxis>
                    <telerik:LinearAxis x:Name="VerticalAxis" Title="€"></telerik:LinearAxis>
                </telerik:ScatterLineSeries.VerticalAxis>
                <telerik:ScatterLineSeries.HorizontalAxis>
                    <telerik:LinearAxis x:Name="HorizontalAxis" Title="Time" MajorStep="1" Minimum="0" Maximum="10"></telerik:LinearAxis>
                </telerik:ScatterLineSeries.HorizontalAxis>
                <telerik:ScatterLineSeries.XValueBinding>
                    <telerik:PropertyNameDataPointBinding PropertyName="Tenor">
                    </telerik:PropertyNameDataPointBinding>
                </telerik:ScatterLineSeries.XValueBinding>
                <telerik:ScatterLineSeries.YValueBinding>
                    <telerik:PropertyNameDataPointBinding PropertyName="Value">
                    </telerik:PropertyNameDataPointBinding>
                </telerik:ScatterLineSeries.YValueBinding>
            </telerik:ScatterLineSeries>

        </telerik:RadCartesianChart>
    </Grid>
</Window>

public class TenorDataPoint
   {

       /// <summary>
       /// Gets or sets Tenor.
       /// </summary>
       public int Tenor
       {
           get
           {
               return TenorDate.Subtract(DateTime.Today).Days;
           }
       }

       /// <summary>
       /// Gets or sets TenorDate.
       /// </summary>
       public DateTime TenorDate { get; set; }

       /// <summary>
       /// Gets or sets Value.
       /// </summary>
       public double Value { get; set; }
   }

[Rosko]

Hi Dominic,

In your scenario you should better use a categorical series with a categorical axis to achieve the desired effect. Please check the code snippet below for further details.

<telerik:RadCartesianChart ZoomChanged="RadCartesianChart_ZoomChanged">
     <telerik:RadCartesianChart.Behaviors>
         <telerik:ChartPanAndZoomBehavior ZoomMode="Both" PanMode="Both"/>
     </telerik:RadCartesianChart.Behaviors>

     <telerik:LineSeries ItemsSource="{Binding DataPoints}">
         <telerik:LineSeries.VerticalAxis>
             <telerik:LinearAxis x:Name="VerticalAxis" Title="€"/>
         </telerik:LineSeries.VerticalAxis>

         <telerik:LineSeries.HorizontalAxis>
             <telerik:CategoricalAxis x:Name="HorizontalAxis"/>
         </telerik:LineSeries.HorizontalAxis>

         <telerik:LineSeries.CategoryBinding>
             <telerik:PropertyNameDataPointBinding PropertyName="Tenor"/>
         </telerik:LineSeries.CategoryBinding>

         <telerik:LineSeries.ValueBinding>
             <telerik:PropertyNameDataPointBinding PropertyName="Value"/>
         </telerik:LineSeries.ValueBinding>
     </telerik:LineSeries>
</telerik:RadCartesianChart>

Regards,
Rosko
Telerik