Installation

There are no preconditions. To use the component, please add a dependency on the Panzoom web block to your project and then place it in the appropriate location of your screen. The panable and zoomable content can then be easily added in the content placeholder.

Additional client actions

To provide further interaction functionality, there are additional client actions that can also be added as dependencies. These expect the associated PanzoomObject as an input parameter. This is supplied to your application as a parameter of the OnReady event of the web block when the component is initialized and should be stored for later use, e.g. in a local variable of your screen.

• Panzoom_GetOptions returns a structure with of the current panzoom options.
• Panzoom_GetPan returns the current pan position (x/y translation).
• Panzoom_GetScale returns the current zoom scale.
• Panzoom_Pan pans to the given x and y coordinates.
• Panzoom_Reset resets the pan and zoom to startX, startY, and startScale. As defined in the panzoom options.
• Panzoom_SetOptions updates the options of the panzoom instance.
• Panzoom_Zoom zooms to the given scale.
• Panzoom_ZoomIn zooms in using the increment as defined in the panzoom options.
• Panzoom_ZoomOut zooms out using the increment as defined in the panzoom options.
• Panzoom_ZoomToPoint zooms to a focal point using the given Scale and point (ClientX/ClientY).

Demo App

This component also comes with a demo app that show how to use the component and lets you try out the client actions.