How to use the @here/harp-mapview.MapViewUtils.calculateDistanceToGroundFromZoomLevel function in @here/harp-mapview

): ViewControlPair {
        const canvas = document.getElementById(id) as HTMLCanvasElement;

        const sampleMapView = new MapView({
            canvas,
            theme: theme !== undefined ? theme : defaultTheme,
            decoderUrl
        });
        sampleMapView.camera.position.set(0, 0, 800);

        // instantiate the default map controls, allowing the user to pan around freely.
        const mapControls = new MapControls(sampleMapView);

        //Set the cameras height according to the given zoom level.
        sampleMapView.camera.position.setZ(
            MapViewUtils.calculateDistanceToGroundFromZoomLevel(sampleMapView, defaultZoomLevel)
        );

        // center the camera somewhere around Berlin geo locations
        sampleMapView.geoCenter = new GeoCoordinates(52.518611, 13.376111, 0);

        setupSyncViewsGrid(sampleMapView, gridPositionX, gridPositionY);
        // react on resize events
        window.addEventListener("resize", () => {
            setupSyncViewsGrid(sampleMapView, gridPositionX, gridPositionY);
        });

        return { mapView: sampleMapView, mapControls };
    }

* Then we listen to render events to trigger new `lookAt` calls with progressing yaw angle offsets:
 * ```typescript
 * [[include:harp_gl_camera_orbit_example_1.ts]]
 * ```
 *
 * Here a GUI is also set up so as to fiddle with the tilt and distance from the page.
 */
export namespace CameraOrbitExample {
    // snippet:harp_gl_camera_orbit_example_0.ts
    const map = createBaseMap();
    // end:harp_gl_camera_orbit_example_0.ts

    // Be sure to see the buildings when starting the example: a zoom level does not translate into
    // the same distance depending on the viewport's height.
    const minDistanceForBuildings =
        Math.ceil(MapViewUtils.calculateDistanceToGroundFromZoomLevel(map, 16.0)) - 500;
    // snippet:harp_gl_camera_orbit_example_1.ts
    const options = { tilt: 25, distance: minDistanceForBuildings, globe: true };
    const dubai = new GeoCoordinates(25.19705, 55.27419);
    let heading = 0;
    map.addEventListener(MapViewEventNames.AfterRender, () => {
        map.lookAt(dubai, options.distance, options.tilt, (heading = (heading + 0.1) % 360));
        map.update();
        updateHTML();
    });
    // end:harp_gl_camera_orbit_example_1.ts

    const gui = new GUI({ width: 300 });
    gui.add(options, "tilt", 0, 80, 0.1);
    gui.add(options, "distance", 300, 60000, 1);
    gui.add(options, "globe").onChange(() => {
        map.projection = options.globe ? sphereProjection : mercatorProjection;

moveAlongTheViewDirection(amount: number) {
        if (amount === 0) {
            return;
        }
        this.camera.getWorldDirection(this.m_currentViewDirection);
        const maxDistance = MapViewUtils.calculateDistanceToGroundFromZoomLevel(
            this.mapView,
            this.mapView.minZoomLevel
        );
        const minDistance = MapViewUtils.calculateDistanceToGroundFromZoomLevel(
            this.mapView,
            this.mapView.maxZoomLevel
        );
        this.m_currentViewDirection.multiplyScalar(amount);
        if (this.mapView.projection.type === geoUtils.ProjectionType.Planar) {
            this.camera.position.z += this.m_currentViewDirection.z;
            this.camera.position.z = Math.max(
                minDistance,
                Math.min(maxDistance, this.camera.position.z)
            );
        } else if (this.mapView.projection.type === geoUtils.ProjectionType.Spherical) {
            const zOnVertical =
                Math.cos(this.camera.position.angleTo(this.m_currentViewDirection)) *
                this.m_currentViewDirection.length();
            this.camera.position.setLength(
                Math.max(

moveAlongTheViewDirection(amount: number) {
        if (amount === 0) {
            return;
        }
        this.camera.getWorldDirection(this.m_currentViewDirection);
        const maxDistance = MapViewUtils.calculateDistanceToGroundFromZoomLevel(
            this.mapView,
            this.mapView.minZoomLevel
        );
        const minDistance = MapViewUtils.calculateDistanceToGroundFromZoomLevel(
            this.mapView,
            this.mapView.maxZoomLevel
        );
        this.m_currentViewDirection.multiplyScalar(amount);
        if (this.mapView.projection.type === geoUtils.ProjectionType.Planar) {
            this.camera.position.z += this.m_currentViewDirection.z;
            this.camera.position.z = Math.max(
                minDistance,
                Math.min(maxDistance, this.camera.position.z)
            );
        } else if (this.mapView.projection.type === geoUtils.ProjectionType.Spherical) {
            const zOnVertical =