20922882527

Committed 12 Jan 2026 02:26PM UTC coverage: 91.1% (+0.01%) from 91.087%

Build # 20922882527

Build Type

Pull #9913

github

Committed by

web-flow

Commit Message

Merge 0e17cc53e into 2a25e5be1

Pull Request Pull Request #9913: feat(core): Improved GlobeController

Run Details

6842 of 7511 branches covered (91.09%)

Branch coverage included in aggregate %.

122 of 122 new or added lines in 8 files covered. (100.0%)

1 existing line in 1 file now uncovered.

56658 of 62193 relevant lines covered (91.1%)

14424.87 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

96.69

/modules/core/src/controllers/globe-controller.ts

// deck.gl
// SPDX-License-Identifier: MIT
// Copyright (c) vis.gl contributors

import {clamp} from '@math.gl/core';
import Controller, {ControllerProps} from './controller';

import {MapState, MapStateProps} from './map-controller';
import type {MapStateInternal} from './map-controller';
import {mod} from '../utils/math-utils';
import LinearInterpolator from '../transitions/linear-interpolator';
import {zoomAdjust} from '../viewports/globe-viewport';

import {MAX_LATITUDE} from '@math.gl/web-mercator';

type GlobeStateInternal = MapStateInternal & {
  startPanPos?: [number, number];
};

class GlobeState extends MapState {
  constructor(
    options: MapStateProps &
      GlobeStateInternal & {
        makeViewport: (props: Record<string, any>) => any;
      }
  ) {
    const {startPanPos, ...mapStateOptions} = options;
    super(mapStateOptions);

    if (startPanPos !== undefined) {
      (this as any)._state.startPanPos = startPanPos;
    }
  }

  panStart({pos}: {pos: [number, number]}): GlobeState {
    const {latitude, longitude, zoom} = this.getViewportProps();
    return this._getUpdatedState({
      startPanLngLat: [longitude, latitude],
      startPanPos: pos,
      startZoom: zoom
    }) as GlobeState;
  }

  pan({pos, startPos}: {pos: [number, number]; startPos?: [number, number]}): GlobeState {
    const state = this.getState() as GlobeStateInternal;
    const startPanLngLat = state.startPanLngLat || this._unproject(startPos);
    if (!startPanLngLat) return this;
    const startZoom = state.startZoom ?? this.getViewportProps().zoom;
    const startPanPos = state.startPanPos || startPos;

    const coords = [startPanLngLat[0], startPanLngLat[1], startZoom];
    const viewport = this.makeViewport(this.getViewportProps());
    const newProps = viewport.panByPosition(coords, pos, startPanPos);
    return this._getUpdatedState(newProps) as GlobeState;
  }

  panEnd(): GlobeState {
    return this._getUpdatedState({
      startPanLngLat: null,
      startPanPos: null,
      startZoom: null
    }) as GlobeState;
  }

  zoom({scale}: {scale: number}): MapState {
    // In Globe view zoom does not take into account the mouse position
    const startZoom = this.getState().startZoom || this.getViewportProps().zoom;
    const zoom = startZoom + Math.log2(scale);
    return this._getUpdatedState({zoom});
  }

  applyConstraints(props: Required<MapStateProps>): Required<MapStateProps> {
    // Ensure zoom is within specified range
    const {longitude, latitude, maxZoom, minZoom, zoom} = props;

    const ZOOM0 = zoomAdjust(0);
    const zoomAdjustment = zoomAdjust(latitude) - ZOOM0;
    props.zoom = clamp(zoom, minZoom + zoomAdjustment, maxZoom + zoomAdjustment);

    if (longitude < -180 || longitude > 180) {
      props.longitude = mod(longitude + 180, 360) - 180;
    }
    props.latitude = clamp(latitude, -MAX_LATITUDE, MAX_LATITUDE);

    return props;
  }
}

export default class GlobeController extends Controller<MapState> {
  ControllerState = GlobeState;

  transition = {
    transitionDuration: 300,
    transitionInterpolator: new LinearInterpolator(['longitude', 'latitude', 'zoom'])
  };

  dragMode: 'pan' | 'rotate' = 'pan';

  setProps(props: ControllerProps) {
    super.setProps(props);

    // TODO - support pitching?
    this.dragRotate = false;
    this.touchRotate = false;
  }
}

1	// deck.gl	1✔
2	// SPDX-License-Identifier: MIT	1✔
3	// Copyright (c) vis.gl contributors	1✔
4		1✔
5	import {clamp} from '@math.gl/core';	1✔
6	import Controller, {ControllerProps} from './controller';	1✔
7		1✔
8	import {MapState, MapStateProps} from './map-controller';	1✔
9	import type {MapStateInternal} from './map-controller';	1✔
10	import {mod} from '../utils/math-utils';	1✔
11	import LinearInterpolator from '../transitions/linear-interpolator';	1✔
12	import {zoomAdjust} from '../viewports/globe-viewport';	1✔
13		1✔
14	import {MAX_LATITUDE} from '@math.gl/web-mercator';	1✔
15		1✔
16	type GlobeStateInternal = MapStateInternal & {	1✔
17	startPanPos?: [number, number];	1✔
18	};	1✔
19		1✔
20	class GlobeState extends MapState {	1✔
21	constructor(	1✔
22	options: MapStateProps &	102✔
23	GlobeStateInternal & {	102✔
24	makeViewport: (props: Record<string, any>) => any;	102✔
25	}	102✔
26	) {	102✔
27	const {startPanPos, ...mapStateOptions} = options;	102✔
28	super(mapStateOptions);	102✔
29		102✔
30	if (startPanPos !== undefined) {	102✔
31	(this as any)._state.startPanPos = startPanPos;	53✔
32	}	53✔
33	}	102✔
34		1✔
35	panStart({pos}: {pos: [number, number]}): GlobeState {	1✔
36	const {latitude, longitude, zoom} = this.getViewportProps();	2✔
37	return this._getUpdatedState({	2✔
38	startPanLngLat: [longitude, latitude],	2✔
39	startPanPos: pos,	2✔
40	startZoom: zoom	2✔
41	}) as GlobeState;	2✔
42	}	2✔
43		1✔
44	pan({pos, startPos}: {pos: [number, number]; startPos?: [number, number]}): GlobeState {	1✔
45	const state = this.getState() as GlobeStateInternal;	5✔
46	const startPanLngLat = state.startPanLngLat \|\| this._unproject(startPos);	5✔
47	if (!startPanLngLat) return this;	5!
48	const startZoom = state.startZoom ?? this.getViewportProps().zoom;	5✔
49	const startPanPos = state.startPanPos \|\| startPos;	5✔
50		5✔
51	const coords = [startPanLngLat[0], startPanLngLat[1], startZoom];	5✔
52	const viewport = this.makeViewport(this.getViewportProps());	5✔
53	const newProps = viewport.panByPosition(coords, pos, startPanPos);	5✔
54	return this._getUpdatedState(newProps) as GlobeState;	5✔
55	}	5✔
56		1✔
57	panEnd(): GlobeState {	1✔
58	return this._getUpdatedState({	2✔
59	startPanLngLat: null,	2✔
60	startPanPos: null,	2✔
61	startZoom: null	2✔
62	}) as GlobeState;	2✔
63	}	2✔
64		1✔
65	zoom({scale}: {scale: number}): MapState {	1✔
66	// In Globe view zoom does not take into account the mouse position	8✔
67	const startZoom = this.getState().startZoom \|\| this.getViewportProps().zoom;	8✔
68	const zoom = startZoom + Math.log2(scale);	8✔
69	return this._getUpdatedState({zoom});	8✔
70	}	8✔
71		1✔
72	applyConstraints(props: Required<MapStateProps>): Required<MapStateProps> {	1✔
73	// Ensure zoom is within specified range	102✔
74	const {longitude, latitude, maxZoom, minZoom, zoom} = props;	102✔
75		102✔
76	const ZOOM0 = zoomAdjust(0);	102✔
77	const zoomAdjustment = zoomAdjust(latitude) - ZOOM0;	102✔
78	props.zoom = clamp(zoom, minZoom + zoomAdjustment, maxZoom + zoomAdjustment);	102✔
79		102✔
80	if (longitude < -180 \|\| longitude > 180) {	102!
UNCOV 81	props.longitude = mod(longitude + 180, 360) - 180;	×
82	}	×
83	props.latitude = clamp(latitude, -MAX_LATITUDE, MAX_LATITUDE);	102✔
84		102✔
85	return props;	102✔
86	}	102✔
87	}	1✔
88		1✔
89	export default class GlobeController extends Controller<MapState> {	1✔
90	ControllerState = GlobeState;	1✔
91		1✔
92	transition = {	1✔
93	transitionDuration: 300,	1✔
94	transitionInterpolator: new LinearInterpolator(['longitude', 'latitude', 'zoom'])	1✔
95	};	1✔
96		1✔
97	dragMode: 'pan' \| 'rotate' = 'pan';	1✔
98		1✔
99	setProps(props: ControllerProps) {	1✔
100	super.setProps(props);	75✔
101		75✔
102	// TODO - support pitching?	75✔
103	this.dragRotate = false;	75✔
104	this.touchRotate = false;	75✔
105	}	75✔
106	}	1✔

visgl / deck.gl / 20922882527

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous