Scroll/Zoom doesn't work on X Axis

[Nemanja]

Hi,

I'm having trouble with the scroll and zoom feature on the RadChart. I have a 2D Range bar set up to mimic a Gantt style chart where certain products are on sale over different weeks and the chart allows users to keep track of the movement.

I have the chart set up to use the High/Low co-ordinates for start week and end week respectively, with the Y axis labels using the Low value while the X axis uses the product name as a label instead of the High value.

The trouble I'm having is when i add the scroll bar to the chart as per the example in the demos, it only works for the Y axis and not the X. The actual scroll bar does appear and the zoom buttons do change the dimensions of the scroller, and the drag select option also seems to work properly, but the actual chart remains unchanged for some reason...

As you can see, the scroll bar on the left is set to a high level of zoom, yet the entire chart is still displayed and no zooming actually happens.



The XAML that I use looks like this:

<telerik:ChartArea Grid.Row="0" x:Name="ChartArea" NoDataString="" LabelFormatBehavior="None" ItemClick="ChartArea_ItemClick"
                                            PaletteBrushesRepeat="False" EnableAnimations="False" >
                            <telerik:ChartArea.ZoomScrollSettingsX>
                                <telerik:ZoomScrollSettings ScrollMode="ScrollAndZoom" MinZoomRange="0.005"/>
                            </telerik:ChartArea.ZoomScrollSettingsX>
                            <telerik:ChartArea.PaletteBrushes>
                                <SolidColorBrush Color="Orange"/>
                            </telerik:ChartArea.PaletteBrushes>
                            <telerik:ChartArea.AxisY>
                                <telerik:AxisY Title="Week" ExtendDirection="Up" DefaultLabelFormat="W20#VAL" AutoRange="True">
                                    <telerik:AxisY.AxisStyles>
                                        <telerik:AxisStyles TitleStyle="{StaticResource CustomAxisTitleStyle}" />
                                    </telerik:AxisY.AxisStyles>
                                </telerik:AxisY>
                            </telerik:ChartArea.AxisY>
                            <telerik:ChartArea.AxisX>
                                <telerik:AxisX LayoutMode="Between" />
                            </telerik:ChartArea.AxisX>
                        </telerik:ChartArea>

The code for the zoom is the same as in the demo and works fine if I set it for the Y axis but for some reason, not the X...

public void ZoomIn(object parameter)
        {
            this.ChartArea.ZoomScrollSettingsX.SuspendNotifications();

            double zoomCenter = this.ChartArea.ZoomScrollSettingsX.RangeStart + (this.ChartArea.ZoomScrollSettingsX.Range / 2);
            double newRange = Math.Max(this.ChartArea.ZoomScrollSettingsX.MinZoomRange, this.ChartArea.ZoomScrollSettingsX.Range) / 2;
            this.ChartArea.ZoomScrollSettingsX.RangeStart = Math.Max(0, zoomCenter - (newRange / 2));
            this.ChartArea.ZoomScrollSettingsX.RangeEnd = Math.Min(1, zoomCenter + (newRange / 2));

            this.ChartArea.ZoomScrollSettingsX.ResumeNotifications();

            ((Telerik.Windows.Controls.DelegateCommand)_zoomInCommand).InvalidateCanExecute();
            ((Telerik.Windows.Controls.DelegateCommand)_zoomOutCommand).InvalidateCanExecute();
        }

What am I doing wrong?

Regards,
Nemanja

[Nemanja]

any updates on this? it's quite urgent..

[Ves]

Hi Nemanja,

Please, find attached a simplified version of the example, which uses your code and works as expected.

Best regards,
Ves
the Telerik team

[Nemanja]

Hi Ves,

thanks for your reply. it was the itemmapping as you suggest in the attached code. it works perfectly now.

Regards,
Nemanja

[Vikash]

Hello Telerik Team,
Can we set value for maximum zoom in  just like zoom out.

[Ves]

Hi Vikash,

You can use the MinZoomRange property, described here.


Regards,
Ves
the Telerik team

[Anitha]

Hi All,
This works fine for X-Axis, but I want the same for Y-Axis.

Any solution for ZoomAndScroll for Y-Axis

Thanks in Advance

[Peshito]

Hi Anitha,

Could you elaborate a bit more on the issue. Is it the MinZoomRange you have in mind that is not working for your scenario? Providing us with sample project pointing out the issue will help us resolve it faster and give you an appropriate answer. In the meantime you can take a look at the help topic describing the use of MinZoomRange property here.

Regards,
Peshito
Telerik