AB4D Forum - ZoomPanel

Forum closed notice, use Issues on GitHub instead

Wed, 01 Apr 2026 13:35:55 +0200

This forum is closed because of problems with sending emails.

Please use Issues on the GitHub Samples project.

Viewbox 'Nan' Error when ZoomPanel loaded with content at ZoomFactor greater than 1.0

Sun, 23 Apr 2023 22:54:37 +0200

We have a Zoom Panel in a ScrollViewer and when the zoom panel is loaded with content that causes it use a zoom factor greater that 1.0 and the thumbnails appear on the scroll bars the vertical scrollbar has the offset and thumbnail size incorrectly set. If you click the up or down buttons on the scrollbar or call any of the vertical related methods, such as LineDown, LineUp, SetVerticalOffset method you get an error like

'0.1,NaN,0.8,0.8' is not a valid value for property 'Viewbox'.

You can trigger this error with the ZoomPanel samples. Load the application and go to the Other Methods page and make sure the first button you click is one of the following:

LineUp, LineDown, MouseWheelUp, MouseWheelDown, PageUp, PageDown or SetVerticalOffset

This will all trigger the error. However if you chose one of the other options first then click one of the above no error is thrown. For example click any of the horizontal related methods first and then one of the vertical ones and it is fine.

If you modify the sample to put a scrollviewer around the ZoomPanel you will notice the vertical scrollbar has an incredibly small thumbnail and is at the top of the scrollbar.

This doesn't occur in the ScrollViewer sample because the initial zoom factor is not greater than 1.0. In the set methods page you can see the image is larger that the view port and so the initial zoom factor is greater than 1.

If you set the ZoomFactor of the ZoomPanel to a value greater than 1 in the constructor of the ScrollViewer sample you will get the error. If you set the zoom factor in Loaded event it is fine. Regardless of where you set the Zoom Factor the Horizontal scrollbar always works fine.

Limited Zooming - Content shifts sideways

Mon, 12 Sep 2022 22:00:44 +0200

Hi there

I need to limit the zooming when using the mouse wheel so I looked at the Limited Zooming Sample. It was easy enough to add the code to my project and it works but I noticed an issue when you zoom all the way in, then zoom out a little and back in. The second time you reach the limit of the zoom the code to center the image doesn't calculate the correct values and the image jumps diagonally. It appears the values returned in OldViewboxValue on the second time you reach the zoom limit differ substantially from those set in NewViewboxValue when the center was re-calculated the first time and this causes the second calculation to shift the center of the viewbox.

It appears to only be a problem when using the mouse wheel.

I haven't been able to work out how to cater for this shift in values. Any help would be greatly appreciated

Regards

Paul

Aspect Ratio On Zoom

Mon, 06 Sep 2021 15:20:44 +0200

Hi,

I am using a Zoom control with the following properties set:

ZoomMode="Move"
Stretch="None"
Viewbox="0 0 1 1"
ViewboxLimits="0 0 1 1"
ViewboxMinSize="0.1 0.1"
IsViewboxLimited="True"
IsTouchRotateEnabled="False"

All works fine until the very final part of the zoom when zooming out. If there are for example 10 zoom outs in total until the zoom out maximum level is reached, zooms 1 to 9 zoom correctly but the last zoom 10, the image inside the canvas in the zoom panel loses its Aspect Ratio?

Minimap control lost with CustomContent

Thu, 15 Apr 2021 12:00:57 +0200

Hello, I am evaluating ZoomPanel for my application and I do need to use the RegisterCustomContentProvider flow.

The CustomContent works fine but the Minimap control gets stucked as soon as I enable the RegisterCustomContentProvider.

The target should be to keep the preview of the whole image in the Minimap with mouse controls of the rectangle enabled.

Thank you,
Martino

Settings ViewboxLimits

Fri, 25 Sep 2020 14:31:50 +0200

Hi,

I am trying to do the following:-

Code:
zp.FitToHeight();

zp.ViewboxLimits = zp.Viewbox;

so that you cannot zoom out further than the fitted zoom

but this doesn't work presumably because the FitToHeight is working in another thread so the ViewboxLimits are set too soon before the Fit is completed.

how can I synchronise this correctly.

Ive been trying to calculate the ViewboxLimits manually but finding it a difficult with the various aspect ratios of the image and zoompanel ....

Jez

HOW TO PROGRAMMATICALLY PAN TO SPECIFIC POINT

Tue, 01 Oct 2019 01:53:55 +0200

I am using the ZoomPanel to navigate around a map image that is 21600x21600. The ZoomPanel itself is 2160x2952 (this is on a 4K display). On the map are markers (like GoogleMap markers). The location of the markers are relative to the map image, so a given marker's location might be 15850,9720.

In general, the zoom panel works great. However, based on user activity, I need to programmatically center a given marker in the viewbox (or as near to center as the map limits allows). I have tried all the various "Translate" methods, and none of them work as I would have expected. When I call the Translate methods, the map moves within the ZoomPanel, but it doesn't move where I expect it to.

For example, when I call TranslateToCenter(new Point(10800,10800)) or TranlateToCenterRelative(new Point(0.5, 0.5)), I would expect the map to move to the center of the map image , but it only moves the map a short (and seemingly random) distance towards the center.

What is the correct method of programmatically setting the center point to a specific x,y location, or getting the given x,y location as close to the center as possible without violating the Viewbox limits?

Here is the xaml for the ZoomPanel:

Attached is a screen capture of the map within the ZoomPanel, including a ZoomPanelDump.

zoompanelmap.png (Size: 238.7 KB / Downloads: 2)

How to detect when image is clipped to turn panning on

Wed, 14 Aug 2019 11:21:31 +0200

Similar to previous question ...

I am looking at an 1920x1080 image in a ZoomPanel. I am using mouse and touch.

When the image is completely visible, I want to pin it to center position and prevent mouse/touch panning.

When the image is clipped because of zoom in, I want to allow panning to view otherwise hidden pixels.

I can prevent the panning but I cant seem to figure out when the image is clipping to turn panning on and off at the right moment.

Jez

Runtime error: ZoomPanelMiniMap.cs not found

Tue, 18 Jun 2019 11:30:54 +0200

Got handed down a project from another engineer who left recently. Finally got round to giving attention to it. It compiled successfully but got that runtime error. StackTrace attached. Strange thing is the

---
Locating source for 'd:\Projects\workspace\company\Nexgen\Source\NextGen\Main\CO.Phoenix\Source\Resource\ZoomPanel\ZoomPanelMiniMap.cs'. Checksum: MD5 {64 ff 3b 9b 1d a9 ac fb 1a 96 29 31 be d8 c7 41}
The file 'd:\Projects\workspace\company\Nexgen\Source\NextGen\Main\CO.Phoenix\Source\Resource\ZoomPanel\ZoomPanelMiniMap.cs' does not exist.
Looking in script documents for 'd:\Projects\workspace\company\Nexgen\Source\NextGen\Main\CO.Phoenix\Source\Resource\ZoomPanel\ZoomPanelMiniMap.cs'...
Looking in the Edit-and-Continue directory 'C:\*REAL_LOCAL_PATH*\enc_temp_folder\'...
The file with the matching checksum was not found in the Edit-and-Continue directory.
Looking in the projects for 'd:\Projects\workspace\company\Nexgen\Source\NextGen\Main\CO.Phoenix\Source\Resource\ZoomPanel\ZoomPanelMiniMap.cs'.
The file was not found in a project.
Searching for documents embedded in the symbol file.
An embedded document was not found.
The debug source files settings for the active solution indicate that the debugger will not ask the user to find the file: d:\Projects\workspace\company\Nexgen\Source\NextGen\Main\CO.Phoenix\Source\Resource\ZoomPanel\ZoomPanelMiniMap.cs.
The debugger could not locate the source file 'd:\Projects\workspace\company\Nexgen\Source\NextGen\Main\CO.Phoenix\Source\Resource\ZoomPanel\ZoomPanelMiniMap.cs'.
---

The project compiled and ran successfully at least until last week. Code hasn't been changed since. Only thing that changed in the environment is the repository link.

Can anyone give an insight to why this is happening?

ViewboxLimits

Fri, 14 Jun 2019 18:07:21 +0200

I've been experimenting with the Painter sample. If I check the 'Is Viewbox limited', I get the panning behavior I desired (I can't pan outside normal display bounds with the mini map).

I won't be allowing mouse wheel on the MiniMap. I only want to limit panning.
I don't really understand what the Viewbox rect represent (I've read and re-read the documentation), but I can't wrap my head around it for some reason.

If I want to allow any zoom, but limit panning, what would I set for the ViewboxLimits and/or ViewboxMinSize?

------

Also, I noticed a bit of a behavior I don't really like with the MiniMap, and don't like, but also unsure how to fix: when zoomed in partially, but not enough where the red box is smaller than the width / height of the actual image, I'm able to pan outside of the bounds (slightly) even when IsViewboxLimited is true.

IE, in the Painter sample, when I'm slightly zoomed in, the vertical bars are enabled, but horizontal bars are disabled (because the content isn't wide enough yet). But even though the horizontal bars are disabled, I can pan left and right. I'd like the content to remain centered (vertically & horizontally), and only allow panning if the appropriate direction scrollbar is enabled / visible.

Here's some screenshots of what I'm trying to describe:
I've zoomed in but haven't panned yet:

  ZoomedNotPanned.png (Size: 91.09 KB / Downloads: 2)

I panned to the left most edge:

  ZoomedPannedLeft.png (Size: 102.83 KB / Downloads: 2)

I panned to the right most edge:

  ZoomedPannedRight.png (Size: 102.4 KB / Downloads: 2)

Basically, in the above screenshots, I should be allowed to pan vertically (because the scroll bars are enabled), but not horizontally. Horizontal should remain centered on the content.

I'm also going to have causes where because I'm using StretchAndZoomDirection: DownAndZoom, I will have an image that even when slightly zoomed in will not have vertical or horizontal scrollbars yet, and the panning there should not be allowed to pan in any direction.

Binding a Viewport to ZoomPanel

Thu, 05 Jul 2018 12:09:50 +0200

Hello

I want to show a customized svg in a ZoomPanel with a customized Viewport, while having a clean MVVM pattern.

I'm currently loading an svg in the ViewModel like so:

Code:
var readerSvg = new Ab2d.ReaderSvg();

svgViewbox = readerSvg.Read(svgFilePath);

This gives me a System.Windows.Controls.Viewbox, which I need to loop through its Children to find customize certain parts of the SVG. This works perfectly.

After that, I could add the svgViewbox to a ZoomPanel, via the Content-Tag:

Code:

But then how to set a Viewport in the form of a Rect?

Code:
Rect rectViewport = new Rect(xFactor, yFactor, widthFactor, heightFactor)

I already know the method SetViewboxNow(rectViewport);
But i want to bind this rectViewport in XAML, to stay true to MVVM pattern.
Thanks in advance.

Panning beyond image

Thu, 26 Apr 2018 14:49:54 +0200

I need the ability to pan beyond the extents of a canvas so I can center a corner of canvas in the middle of the form. Our users need to zoom into detailed areas that they want centered.

zoomedin.png (Size: 23.8 KB / Downloads: 0)

WhatINeed.png (Size: 14.83 KB / Downloads: 0)

Maximum size of content

Thu, 15 Mar 2018 21:50:20 +0100

I am using ZoomPanel with a windows canvas. How do I set the size of the content. I.E. the canvas control.

I know how to set the height and width of the canvas but does that increase the zoomable area?

I need a very large canvas and setting the size doesn't seem to effect the drawing area.
Sorry if this is a dumb questions. I am evaluating the product.

Customize ZoomPanelNavigator

Tue, 13 Feb 2018 17:44:55 +0100

Is it possible to customize the ZoomPanelNavigator further?

I have seen in the examples that I can change color and size.

But can I change the look of the buttons and the slider or use my own images?

Zoom Panel Minimum Zoom

Tue, 13 Feb 2018 10:41:22 +0100

Hi,

I am trying to add the ZoomPanel to my image editing application. It works so far but I can not seem to figure out how to zoom out past the ZoomPanel boundaries.

Here is an image of my Minimum Zoom, I can not zoom out further than that.

zoompanel.jpg (Size: 97.15 KB / Downloads: 3)

And here is my code:

Code:


             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 

             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 

             xmlns:ab2d="clr-namespace:Ab2d.Controls;assembly=Ab2d.Controls.ZoomPanel"

             xmlns:local="clr-namespace:Electric.View"

             DataContext="{Binding Source={StaticResource Locator}, Path=Canvas}"

             mc:Ignorable="d" 

             d:DesignHeight="800" d:DesignWidth="800"

             Background="Green">

    

        
            ViewboxLimits="0 0 1 1"

             ViewboxMinSize="0.1 0.1"

             IsViewboxLimited="False"

             IsZoomPositionPreserved="True"

             Viewbox="0 0 1 1">

             
                 Source="{Binding ViewerImage}" 

                 Width="{Binding ViewerImage.Width}" 

                 Height="{Binding ViewerImage.Height}"/>

Can you help?