Class: ViewPort
- Last UpdatedMay 21, 2025
- 4 minute read
A viewport object holds information about the HTML element in which the map is rendered. It contains the information regarding the view port size and triggers events when the size changes.
| Name | Type | Description |
|---|---|---|
element |
HTMLElement |
The HTML element where the map is to be rendered |
opt_options |
H.map.ViewPort.Options |
optional
Optional configuration parameters |
Extends
Implements
Members
-
center H.math.Point non-null
-
This property holds a value indicating the current center point of the viewport.
-
This property holds the HTML element that defines the viewport.
-
This property holds a value indicating the height of the viewport.
-
This property holds a value indicating the current margin of the viewport.
-
padding H.map.ViewPort.Padding non-null
-
This property holds a value indicating the current padding of the viewport.
-
This property holds a value indicating the width of the viewport.
Methods
-
addEventListener (type, handler, opt_capture, opt_scope) inherited
-
This method adds a listener for a specific event.
Note that to prevent potential memory leaks, you must either call
removeEventListenerordisposeon the given object when you no longer need it. -
addOnDisposeCallback (callback, opt_scope) inherited
-
This method adds a callback which is triggered when the
EventTargetobject is being disposed.Name Type Description callbackfunction The callback function.
opt_scopeObject optional An optional scope for the callback function
-
dispatchEvent (evt) inherited
-
This method dispatches an event on the
EventTargetobject.Name Type Description evtH.util.Event | string An object representing the event or a string with the event name
-
dispose () inherited
-
This method removes listeners from the given object. Classes that extend
EventTargetmay need to override this method in order to remove references to DOM Elements and additional listeners. -
This method ends an interaction and applies a kinetic movement if it was specified in a call to
startInteraction()Name Type Description opt_preventKineticsboolean optional A value indicating a kinetic movement at the end of the interaction is to be prevented (
trueor notfalse) -
This method resolves direct screen (view port) interaction. This function modifies the current view according to values passed in by the caller.
-
removeEventListener (type, handler, opt_capture, opt_scope) inherited
-
This method removes a previously added listener from the
EventTargetinstance. -
This method updates the size of the viewport to match the container size. It must be called whenever the HTML element changes size in order to update the map's viewport values.
-
This method sets the margin on the viewport.
Name Type Description marginnumber A value indicating the margin used to fetch map data
Fires:
- H.map.ViewPort#event:marginchange
-
This method sets a value indicating the padding of the viewport. Padding results in a shifted map center which is the visual center of the padded area.
Fires:
- H.map.ViewPort#event:paddingchange
-
This method starts the interaction with the view port. It should be called every time a new interaction is started, for example on mouse grab or touch start.
Name Type Description modifiersH.math.BitMask.<!H.map.render.RenderEngine.InteractionModifiers> Specifies what operations should performed during every interaction.
opt_kineticsH.util.kinetics.IKinetics optional Specifies a kinetic move at the end of interaction
Type Definitions
-
Viewport initialization options.
Properties:
Name Type Argument Description marginnumber <optional>
The size in pixel of the supplemental area to render for each side of the map
paddingH.map.ViewPort.Padding <optional>
The padding in pixels for each side of the map
-
This variable defines viewport padding.
Properties:
Events
-
Event fired when the rendered map is synchronized with the properties of the viewport.
Type:
-
Event fired when the properties of the view-port, such as padding, margin or size, change.
Type:
