Pan and Zoom Panel

• Dec 24, 2021

The Pan and Zoom panel is used to navigate large and complex diagrams.

The blue box indicates the area that is shown in the viewport. End users can resize the blue box, or move it by clicking within the panel or dragging the box. They can also drag a rectangle on the panel to zoom an area.

End-users can invoke the panel using the Panes menu on the View Ribbon page.

The table below lists the main customization options.

Visibility	DiagramControl.ShowPanAndZoomPanel
Zoom functionality	DiagramControl.AllowZoom

To add a separate Pan and Zoom control to a diagram, create a DevExpress.Xpf.Diagram.DiagramPanAndZoomControl and bind its DevExpress.Xpf.Diagram.DiagramPanAndZoomControl.Diagram property to the DiagramControl. The ShowPanAndZoomPanel property doesn’t affect a separate Pan and Zoom control. You can bind the DiagramPanAndZoomControl.Visibility property to the ShowPanAndZoomPanel property in the following manner:

XAML

<dxdiag:DiagramControl Name="diagram ...>
    ...
</dxdiag:DiagramControl>
<dxdiag:DiagramPanAndZoomControl ...
    Visibility="{Binding ShowPanAndZoomPanel, ElementName=diagram,
        Converter={dxmvvm:BooleanToVisibilityConverter}}" />