maplibre-gl 3.1.0 → 3.2.0-pre.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +7 -7
- package/build/generate-doc-images.ts +73 -0
- package/build/generate-docs.ts +100 -0
- package/build/generate-struct-arrays.ts +9 -12
- package/dist/maplibre-gl-csp-worker.js +1 -1
- package/dist/maplibre-gl-csp-worker.js.map +1 -1
- package/dist/maplibre-gl-csp.js +1 -1
- package/dist/maplibre-gl-csp.js.map +1 -1
- package/dist/maplibre-gl-dev.js +3303 -3398
- package/dist/maplibre-gl-dev.js.map +1 -1
- package/dist/maplibre-gl.d.ts +3899 -3531
- package/dist/maplibre-gl.js +3 -3
- package/dist/maplibre-gl.js.map +1 -1
- package/package.json +28 -25
- package/src/data/array_types.g.ts +14 -48
- package/src/data/bucket/circle_bucket.ts +11 -14
- package/src/data/bucket/fill_bucket.test.ts +6 -6
- package/src/data/bucket/fill_bucket.ts +10 -12
- package/src/data/bucket/fill_extrusion_bucket.ts +11 -13
- package/src/data/bucket/heatmap_bucket.ts +3 -6
- package/src/data/bucket/line_attributes.ts +1 -2
- package/src/data/bucket/line_attributes_ext.ts +1 -2
- package/src/data/bucket/line_bucket.test.ts +5 -5
- package/src/data/bucket/line_bucket.ts +18 -21
- package/src/data/bucket/pattern_attributes.ts +1 -3
- package/src/data/bucket/pattern_bucket_features.ts +3 -3
- package/src/data/bucket/symbol_bucket.test.ts +5 -5
- package/src/data/bucket/symbol_bucket.ts +12 -15
- package/src/data/bucket.ts +7 -11
- package/src/data/dem_data.test.ts +1 -1
- package/src/data/dem_data.ts +1 -1
- package/src/data/evaluation_feature.ts +4 -5
- package/src/data/extent.ts +1 -4
- package/src/data/feature_index.ts +14 -13
- package/src/data/feature_position_map.test.ts +4 -4
- package/src/data/feature_position_map.ts +1 -1
- package/src/data/index_array_type.ts +0 -1
- package/src/data/load_geometry.test.ts +1 -1
- package/src/data/load_geometry.ts +3 -4
- package/src/data/program_configuration.ts +6 -11
- package/src/data/segment.ts +9 -6
- package/src/geo/edge_insets.test.ts +1 -1
- package/src/geo/edge_insets.ts +36 -26
- package/src/geo/lng_lat.test.ts +1 -1
- package/src/geo/lng_lat.ts +61 -44
- package/src/geo/lng_lat_bounds.test.ts +2 -2
- package/src/geo/lng_lat_bounds.ts +88 -68
- package/src/geo/mercator_coordinate.test.ts +2 -2
- package/src/geo/mercator_coordinate.ts +34 -27
- package/src/geo/transform.test.ts +3 -3
- package/src/geo/transform.ts +58 -79
- package/src/gl/color_mode.ts +1 -3
- package/src/gl/context.ts +12 -11
- package/src/gl/cull_face_mode.ts +1 -3
- package/src/gl/depth_mode.ts +1 -3
- package/src/gl/framebuffer.ts +5 -4
- package/src/gl/index_buffer.ts +5 -4
- package/src/gl/render_pool.test.ts +2 -2
- package/src/gl/render_pool.ts +5 -5
- package/src/gl/state.test.ts +1 -1
- package/src/gl/stencil_mode.ts +1 -3
- package/src/gl/value.ts +1 -1
- package/src/gl/vertex_buffer.test.ts +2 -2
- package/src/gl/vertex_buffer.ts +8 -14
- package/src/index.test.ts +2 -2
- package/src/index.ts +121 -113
- package/src/render/draw_background.ts +7 -9
- package/src/render/draw_circle.ts +13 -15
- package/src/render/draw_collision_debug.ts +11 -13
- package/src/render/draw_custom.ts +6 -8
- package/src/render/draw_debug.test.ts +4 -4
- package/src/render/draw_debug.ts +8 -10
- package/src/render/draw_fill.test.ts +13 -13
- package/src/render/draw_fill.ts +9 -11
- package/src/render/draw_fill_extrusion.ts +10 -12
- package/src/render/draw_heatmap.ts +12 -14
- package/src/render/draw_hillshade.ts +10 -12
- package/src/render/draw_line.ts +9 -9
- package/src/render/draw_raster.ts +9 -11
- package/src/render/draw_symbol.test.ts +16 -16
- package/src/render/draw_symbol.ts +15 -16
- package/src/render/draw_terrain.ts +11 -11
- package/src/render/glyph_atlas.ts +10 -1
- package/src/render/glyph_manager.test.ts +3 -3
- package/src/render/glyph_manager.ts +7 -7
- package/src/render/image_atlas.ts +6 -3
- package/src/render/image_manager.ts +3 -5
- package/src/render/line_atlas.test.ts +1 -1
- package/src/render/line_atlas.ts +19 -14
- package/src/render/painter.ts +85 -65
- package/src/render/program/background_program.ts +2 -2
- package/src/render/program/circle_program.ts +5 -5
- package/src/render/program/clipping_mask_program.ts +1 -1
- package/src/render/program/collision_program.ts +4 -4
- package/src/render/program/debug_program.ts +1 -1
- package/src/render/program/fill_extrusion_program.ts +3 -3
- package/src/render/program/fill_program.ts +3 -3
- package/src/render/program/heatmap_program.ts +5 -5
- package/src/render/program/hillshade_program.ts +7 -7
- package/src/render/program/line_program.ts +6 -6
- package/src/render/program/pattern.ts +3 -3
- package/src/render/program/raster_program.ts +2 -2
- package/src/render/program/symbol_program.ts +2 -2
- package/src/render/program/terrain_program.ts +1 -1
- package/src/render/program.ts +18 -16
- package/src/render/render_to_texture.test.ts +15 -15
- package/src/render/render_to_texture.ts +10 -10
- package/src/render/terrain.test.ts +38 -7
- package/src/render/terrain.ts +103 -67
- package/src/render/texture.ts +5 -4
- package/src/render/uniform_binding.test.ts +1 -1
- package/src/render/uniform_binding.ts +7 -1
- package/src/render/update_pattern_positions_in_program.ts +5 -5
- package/src/render/vertex_array_object.ts +9 -8
- package/src/shaders/encode_attribute.ts +0 -2
- package/src/shaders/shaders.ts +1 -3
- package/src/source/canvas_source.test.ts +6 -6
- package/src/source/canvas_source.ts +46 -60
- package/src/source/geojson_source.test.ts +5 -5
- package/src/source/geojson_source.ts +75 -59
- package/src/source/geojson_source_diff.ts +39 -2
- package/src/source/geojson_worker_source.test.ts +3 -3
- package/src/source/geojson_worker_source.ts +20 -26
- package/src/source/geojson_wrapper.test.ts +3 -3
- package/src/source/geojson_wrapper.ts +2 -4
- package/src/source/image_source.test.ts +9 -8
- package/src/source/image_source.ts +49 -35
- package/src/source/load_tilejson.ts +2 -2
- package/src/source/pixels_to_tile_units.ts +2 -3
- package/src/source/query_features.test.ts +3 -3
- package/src/source/query_features.ts +50 -19
- package/src/source/raster_dem_tile_source.test.ts +3 -3
- package/src/source/raster_dem_tile_source.ts +23 -10
- package/src/source/raster_dem_tile_worker_source.test.ts +2 -2
- package/src/source/raster_dem_tile_worker_source.ts +3 -5
- package/src/source/raster_tile_source.test.ts +3 -3
- package/src/source/raster_tile_source.ts +38 -11
- package/src/source/rtl_text_plugin.ts +4 -1
- package/src/source/source.ts +67 -59
- package/src/source/source_cache.test.ts +7 -7
- package/src/source/source_cache.ts +17 -38
- package/src/source/source_state.ts +2 -5
- package/src/source/terrain_source_cache.test.ts +8 -8
- package/src/source/terrain_source_cache.ts +42 -27
- package/src/source/tile.test.ts +3 -3
- package/src/source/tile.ts +32 -38
- package/src/source/tile_bounds.ts +2 -4
- package/src/source/tile_cache.test.ts +2 -2
- package/src/source/tile_cache.ts +20 -30
- package/src/source/tile_id.ts +11 -2
- package/src/source/vector_tile_source.test.ts +3 -3
- package/src/source/vector_tile_source.ts +34 -24
- package/src/source/vector_tile_worker_source.test.ts +4 -4
- package/src/source/vector_tile_worker_source.ts +11 -23
- package/src/source/video_source.test.ts +5 -5
- package/src/source/video_source.ts +21 -28
- package/src/source/worker.ts +6 -8
- package/src/source/worker_source.ts +6 -8
- package/src/source/worker_tile.test.ts +5 -5
- package/src/source/worker_tile.ts +13 -16
- package/src/style/create_style_layer.ts +31 -26
- package/src/style/evaluation_parameters.ts +5 -4
- package/src/style/format_section_override.test.ts +2 -2
- package/src/style/format_section_override.ts +1 -1
- package/src/style/light.test.ts +2 -2
- package/src/style/light.ts +3 -5
- package/src/style/load_glyph_range.test.ts +1 -1
- package/src/style/load_glyph_range.ts +3 -3
- package/src/style/load_sprite.test.ts +1 -1
- package/src/style/load_sprite.ts +3 -3
- package/src/style/parse_glyph_pbf.ts +1 -1
- package/src/style/pauseable_placement.ts +7 -9
- package/src/style/properties.ts +4 -53
- package/src/style/query_utils.ts +3 -3
- package/src/style/style.test.ts +22 -19
- package/src/style/style.ts +118 -84
- package/src/style/style_glyph.ts +6 -0
- package/src/style/style_image.ts +39 -33
- package/src/style/style_layer/background_style_layer.ts +2 -4
- package/src/style/style_layer/circle_style_layer.ts +7 -6
- package/src/style/style_layer/custom_style_layer.ts +23 -48
- package/src/style/style_layer/fill_extrusion_style_layer.ts +4 -6
- package/src/style/style_layer/fill_style_layer.ts +5 -7
- package/src/style/style_layer/heatmap_style_layer.ts +8 -7
- package/src/style/style_layer/hillshade_style_layer.ts +2 -4
- package/src/style/style_layer/line_style_layer.ts +6 -8
- package/src/style/style_layer/overlap_mode.test.ts +3 -3
- package/src/style/style_layer/overlap_mode.ts +3 -0
- package/src/style/style_layer/raster_style_layer.ts +2 -4
- package/src/style/style_layer/symbol_style_layer.ts +6 -8
- package/src/style/style_layer/typed_style_layer.ts +7 -7
- package/src/style/style_layer.test.ts +5 -5
- package/src/style/style_layer.ts +7 -6
- package/src/style/style_layer_index.test.ts +1 -1
- package/src/style/style_layer_index.ts +3 -5
- package/src/style/zoom_history.ts +1 -3
- package/src/symbol/anchor.test.ts +1 -1
- package/src/symbol/anchor.ts +1 -3
- package/src/symbol/check_max_angle.test.ts +8 -2
- package/src/symbol/check_max_angle.ts +10 -13
- package/src/symbol/clip_line.test.ts +1 -1
- package/src/symbol/clip_line.ts +6 -9
- package/src/symbol/collision_feature.test.ts +2 -2
- package/src/symbol/collision_feature.ts +7 -12
- package/src/symbol/collision_index.test.ts +2 -2
- package/src/symbol/collision_index.ts +5 -11
- package/src/symbol/cross_tile_symbol_index.test.ts +2 -2
- package/src/symbol/cross_tile_symbol_index.ts +5 -7
- package/src/symbol/get_anchors.ts +2 -2
- package/src/symbol/grid_index.test.ts +1 -1
- package/src/symbol/grid_index.ts +4 -5
- package/src/symbol/merge_lines.test.ts +1 -1
- package/src/symbol/merge_lines.ts +1 -1
- package/src/symbol/opacity_state.ts +1 -3
- package/src/symbol/path_interpolator.test.ts +1 -1
- package/src/symbol/path_interpolator.ts +1 -3
- package/src/symbol/placement.ts +9 -9
- package/src/symbol/projection.ts +61 -34
- package/src/symbol/quads.ts +7 -11
- package/src/symbol/shaping.ts +1 -1
- package/src/symbol/symbol_layout.ts +9 -12
- package/src/symbol/symbol_size.ts +1 -1
- package/src/symbol/symbol_style_layer.test.ts +4 -4
- package/src/symbol/transform_text.ts +2 -2
- package/src/types/callback.ts +14 -14
- package/src/types/cancelable.ts +3 -0
- package/src/types/transferable.ts +3 -0
- package/src/ui/anchor.ts +4 -0
- package/src/ui/camera.test.ts +6 -6
- package/src/ui/camera.ts +392 -361
- package/src/ui/control/attribution_control.test.ts +1 -1
- package/src/ui/control/attribution_control.ts +34 -30
- package/src/ui/control/control.ts +14 -20
- package/src/ui/control/fullscreen_control.test.ts +1 -1
- package/src/ui/control/fullscreen_control.ts +21 -26
- package/src/ui/control/geolocate_control.test.ts +5 -5
- package/src/ui/control/geolocate_control.ts +181 -194
- package/src/ui/control/logo_control.ts +20 -16
- package/src/ui/control/navigation_control.test.ts +1 -1
- package/src/ui/control/navigation_control.ts +46 -42
- package/src/ui/control/scale_control.test.ts +1 -1
- package/src/ui/control/scale_control.ts +30 -21
- package/src/ui/control/terrain_control.test.ts +1 -1
- package/src/ui/control/terrain_control.ts +14 -18
- package/src/ui/default_locale.ts +1 -3
- package/src/ui/events.ts +570 -1281
- package/src/ui/handler/box_zoom.test.ts +2 -2
- package/src/ui/handler/box_zoom.ts +16 -11
- package/src/ui/handler/click_zoom.ts +11 -3
- package/src/ui/handler/cooperative_gestures.test.ts +3 -3
- package/src/ui/handler/dblclick_zoom.test.ts +1 -1
- package/src/ui/handler/drag_handler.ts +30 -22
- package/src/ui/handler/drag_move_state_manager.ts +1 -1
- package/src/ui/handler/drag_pan.test.ts +2 -2
- package/src/ui/handler/drag_rotate.test.ts +3 -3
- package/src/ui/handler/keyboard.test.ts +2 -2
- package/src/ui/handler/keyboard.ts +22 -13
- package/src/ui/handler/map_event.test.ts +2 -2
- package/src/ui/handler/map_event.ts +1 -1
- package/src/ui/handler/mouse.ts +1 -1
- package/src/ui/handler/mouse_rotate.test.ts +3 -3
- package/src/ui/handler/scroll_zoom.test.ts +3 -3
- package/src/ui/handler/scroll_zoom.ts +45 -52
- package/src/ui/handler/shim/dblclick_zoom.ts +12 -6
- package/src/ui/handler/shim/drag_pan.ts +34 -14
- package/src/ui/handler/shim/drag_rotate.ts +20 -12
- package/src/ui/handler/shim/two_fingers_touch.ts +24 -18
- package/src/ui/handler/tap_drag_zoom.test.ts +113 -0
- package/src/ui/handler/tap_drag_zoom.ts +18 -10
- package/src/ui/handler/tap_recognizer.ts +1 -1
- package/src/ui/handler/tap_zoom.ts +4 -3
- package/src/ui/handler/touch_pan.ts +3 -2
- package/src/ui/handler/transform-provider.ts +4 -6
- package/src/ui/handler/two_fingers_touch.test.ts +3 -3
- package/src/ui/handler/two_fingers_touch.ts +64 -47
- package/src/ui/handler_inertia.ts +4 -4
- package/src/ui/handler_manager.ts +86 -52
- package/src/ui/hash.test.ts +1 -1
- package/src/ui/hash.ts +21 -28
- package/src/ui/map/isMoving.test.ts +3 -3
- package/src/ui/map/isRotating.test.ts +3 -3
- package/src/ui/map/isZooming.test.ts +3 -3
- package/src/ui/map.test.ts +97 -8
- package/src/ui/map.ts +856 -702
- package/src/ui/map_events.test.ts +1 -1
- package/src/ui/marker.test.ts +35 -15
- package/src/ui/marker.ts +220 -141
- package/src/ui/popup.test.ts +2 -2
- package/src/ui/popup.ts +179 -147
- package/src/util/actor.test.ts +7 -7
- package/src/util/actor.ts +25 -22
- package/src/util/ajax.ts +37 -17
- package/src/util/browser.test.ts +1 -1
- package/src/util/browser.ts +2 -6
- package/src/util/classify_rings.test.ts +1 -1
- package/src/util/classify_rings.ts +1 -1
- package/src/util/color_ramp.ts +0 -2
- package/src/util/config.ts +6 -3
- package/src/util/debug.ts +0 -2
- package/src/util/dictionary_coder.ts +1 -4
- package/src/util/dispatcher.test.ts +3 -3
- package/src/util/dispatcher.ts +4 -9
- package/src/util/dom.ts +1 -1
- package/src/util/evented.ts +23 -18
- package/src/util/find_pole_of_inaccessibility.test.ts +1 -1
- package/src/util/find_pole_of_inaccessibility.ts +4 -5
- package/src/util/global_worker_pool.ts +2 -3
- package/src/util/image.ts +10 -4
- package/src/util/image_request.test.ts +3 -3
- package/src/util/image_request.ts +15 -14
- package/src/util/is_char_in_unicode_block.ts +1 -3
- package/src/util/offscreen_canvas_supported.ts +1 -1
- package/src/util/performance.ts +1 -2
- package/src/util/request_manager.ts +4 -0
- package/src/util/resolve_tokens.test.ts +1 -1
- package/src/util/resolve_tokens.ts +3 -6
- package/src/util/script_detection.ts +1 -4
- package/src/util/smart_wrap.ts +3 -5
- package/src/util/struct_array.ts +18 -14
- package/src/util/style.ts +2 -2
- package/src/util/task_queue.test.ts +1 -1
- package/src/util/task_queue.ts +1 -3
- package/src/util/test/mock_webgl.ts +6 -0
- package/src/util/test/util.ts +2 -2
- package/src/util/throttle.test.ts +1 -1
- package/src/util/throttle.ts +1 -2
- package/src/util/throttled_invoker.ts +1 -5
- package/src/util/transferable_grid_index.test.ts +1 -1
- package/src/util/transferable_grid_index.ts +1 -3
- package/src/util/util.test.ts +1 -14
- package/src/util/util.ts +44 -107
- package/src/util/vectortile_to_geojson.ts +13 -3
- package/src/util/verticalize_punctuation.ts +1 -1
- package/src/util/web_worker.ts +2 -2
- package/src/util/web_worker_transfer.ts +11 -8
- package/src/util/webp_supported.ts +2 -4
- package/src/util/worker_pool.test.ts +1 -1
- package/src/util/worker_pool.ts +4 -5
package/src/ui/camera.ts
CHANGED
|
@@ -1,30 +1,35 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {extend, warnOnce, clamp, wrap, defaultEasing, pick} from '../util/util';
|
|
2
2
|
import {interpolates} from '@maplibre/maplibre-gl-style-spec';
|
|
3
|
-
import browser from '../util/browser';
|
|
4
|
-
import LngLat from '../geo/lng_lat';
|
|
5
|
-
import LngLatBounds from '../geo/lng_lat_bounds';
|
|
3
|
+
import {browser} from '../util/browser';
|
|
4
|
+
import {LngLat} from '../geo/lng_lat';
|
|
5
|
+
import {LngLatBounds} from '../geo/lng_lat_bounds';
|
|
6
6
|
import Point from '@mapbox/point-geometry';
|
|
7
7
|
import {Event, Evented} from '../util/evented';
|
|
8
|
-
import {
|
|
9
|
-
import Terrain from '../render/terrain';
|
|
8
|
+
import {Terrain} from '../render/terrain';
|
|
10
9
|
|
|
11
|
-
import type Transform from '../geo/transform';
|
|
10
|
+
import type {Transform} from '../geo/transform';
|
|
12
11
|
import type {LngLatLike} from '../geo/lng_lat';
|
|
13
12
|
import type {LngLatBoundsLike} from '../geo/lng_lat_bounds';
|
|
14
13
|
import type {TaskID} from '../util/task_queue';
|
|
15
14
|
import type {PaddingOptions} from '../geo/edge_insets';
|
|
16
|
-
import MercatorCoordinate from '../geo/mercator_coordinate';
|
|
15
|
+
import {MercatorCoordinate} from '../geo/mercator_coordinate';
|
|
17
16
|
|
|
18
17
|
/**
|
|
19
18
|
* A [Point](https://github.com/mapbox/point-geometry) or an array of two numbers representing `x` and `y` screen coordinates in pixels.
|
|
20
19
|
*
|
|
21
|
-
* @
|
|
20
|
+
* @group Geography and Geometry
|
|
21
|
+
*
|
|
22
22
|
* @example
|
|
23
|
-
*
|
|
24
|
-
*
|
|
23
|
+
* ```ts
|
|
24
|
+
* let p1 = new Point(-77, 38); // a PointLike which is a Point
|
|
25
|
+
* let p2 = [-77, 38]; // a PointLike which is an array of two numbers
|
|
26
|
+
* ```
|
|
25
27
|
*/
|
|
26
28
|
export type PointLike = Point | [number, number];
|
|
27
29
|
|
|
30
|
+
/**
|
|
31
|
+
* A helper to allow require of at least one propery
|
|
32
|
+
*/
|
|
28
33
|
export type RequireAtLeastOne<T> = { [K in keyof T]-?: Required<Pick<T, K>> & Partial<Pick<T, Exclude<keyof T, K>>>; }[keyof T];
|
|
29
34
|
|
|
30
35
|
/**
|
|
@@ -32,20 +37,10 @@ export type RequireAtLeastOne<T> = { [K in keyof T]-?: Required<Pick<T, K>> & Pa
|
|
|
32
37
|
* zoom, bearing, and pitch of the camera. All properties are optional, and when a property is omitted, the current
|
|
33
38
|
* camera value for that property will remain unchanged.
|
|
34
39
|
*
|
|
35
|
-
* @typedef {Object} CameraOptions
|
|
36
|
-
* @property {LngLatLike} center The desired center.
|
|
37
|
-
* @property {number} zoom The desired zoom level.
|
|
38
|
-
* @property {number} bearing The desired bearing in degrees. The bearing is the compass direction that
|
|
39
|
-
* is "up". For example, `bearing: 90` orients the map so that east is up.
|
|
40
|
-
* @property {number} pitch The desired pitch in degrees. The pitch is the angle towards the horizon
|
|
41
|
-
* measured in degrees with a range between 0 and 60 degrees. For example, pitch: 0 provides the appearance
|
|
42
|
-
* of looking straight down at the map, while pitch: 60 tilts the user's perspective towards the horizon.
|
|
43
|
-
* Increasing the pitch value is often used to display 3D objects.
|
|
44
|
-
* @property {LngLatLike} around If `zoom` is specified, `around` determines the point around which the zoom is centered.
|
|
45
|
-
* @property {PaddingOptions} padding Dimensions in pixels applied on each side of the viewport for shifting the vanishing point.
|
|
46
40
|
* @example
|
|
47
|
-
*
|
|
48
|
-
*
|
|
41
|
+
* Set the map's initial perspective with CameraOptions
|
|
42
|
+
* ```ts
|
|
43
|
+
* let map = new maplibregl.Map({
|
|
49
44
|
* container: 'map',
|
|
50
45
|
* style: 'https://demotiles.maplibre.org/style.json',
|
|
51
46
|
* center: [-73.5804, 45.53483],
|
|
@@ -53,38 +48,115 @@ export type RequireAtLeastOne<T> = { [K in keyof T]-?: Required<Pick<T, K>> & Pa
|
|
|
53
48
|
* bearing: -60,
|
|
54
49
|
* zoom: 10
|
|
55
50
|
* });
|
|
56
|
-
*
|
|
57
|
-
* @see [
|
|
58
|
-
* @see [
|
|
59
|
-
* @see [
|
|
51
|
+
* ```
|
|
52
|
+
* @see [Set pitch and bearing](https://maplibre.org/maplibre-gl-js/docs/examples/set-perspective/)
|
|
53
|
+
* @see [Jump to a series of locations](https://maplibre.org/maplibre-gl-js/docs/examples/jump-to/)
|
|
54
|
+
* @see [Fly to a location](https://maplibre.org/maplibre-gl-js/docs/examples/flyto/)
|
|
55
|
+
* @see [Display buildings in 3D](https://maplibre.org/maplibre-gl-js/docs/examples/3d-buildings/)
|
|
60
56
|
*/
|
|
61
57
|
export type CameraOptions = CenterZoomBearing & {
|
|
58
|
+
/**
|
|
59
|
+
* The desired pitch in degrees. The pitch is the angle towards the horizon
|
|
60
|
+
* measured in degrees with a range between 0 and 60 degrees. For example, pitch: 0 provides the appearance
|
|
61
|
+
* of looking straight down at the map, while pitch: 60 tilts the user's perspective towards the horizon.
|
|
62
|
+
* Increasing the pitch value is often used to display 3D objects.
|
|
63
|
+
*/
|
|
62
64
|
pitch?: number;
|
|
65
|
+
/**
|
|
66
|
+
* If `zoom` is specified, `around` determines the point around which the zoom is centered.
|
|
67
|
+
*/
|
|
63
68
|
around?: LngLatLike;
|
|
64
69
|
};
|
|
65
70
|
|
|
71
|
+
/**
|
|
72
|
+
* Holds center, zoom and bearing properties
|
|
73
|
+
*/
|
|
66
74
|
export type CenterZoomBearing = {
|
|
75
|
+
/**
|
|
76
|
+
* The desired center.
|
|
77
|
+
*/
|
|
67
78
|
center?: LngLatLike;
|
|
79
|
+
/**
|
|
80
|
+
* The desired zoom level.
|
|
81
|
+
*/
|
|
68
82
|
zoom?: number;
|
|
83
|
+
/**
|
|
84
|
+
* The desired bearing in degrees. The bearing is the compass direction that
|
|
85
|
+
* is "up". For example, `bearing: 90` orients the map so that east is up.
|
|
86
|
+
*/
|
|
69
87
|
bearing?: number;
|
|
70
88
|
}
|
|
71
89
|
|
|
90
|
+
/**
|
|
91
|
+
* The options object related to the {@link Map#jumpTo} method
|
|
92
|
+
*/
|
|
72
93
|
export type JumpToOptions = CameraOptions & {
|
|
94
|
+
/**
|
|
95
|
+
* Dimensions in pixels applied on each side of the viewport for shifting the vanishing point.
|
|
96
|
+
*/
|
|
73
97
|
padding?: PaddingOptions;
|
|
74
98
|
}
|
|
75
99
|
|
|
100
|
+
/**
|
|
101
|
+
* A options object for the {@link Map#cameraForBounds} method
|
|
102
|
+
*/
|
|
76
103
|
export type CameraForBoundsOptions = CameraOptions & {
|
|
104
|
+
/**
|
|
105
|
+
* The amount of padding in pixels to add to the given bounds.
|
|
106
|
+
*/
|
|
77
107
|
padding?: number | RequireAtLeastOne<PaddingOptions>;
|
|
108
|
+
/**
|
|
109
|
+
* The center of the given bounds relative to the map's center, measured in pixels.
|
|
110
|
+
* @defaultValue [0, 0]
|
|
111
|
+
*/
|
|
78
112
|
offset?: PointLike;
|
|
113
|
+
/**
|
|
114
|
+
* The maximum zoom level to allow when the camera would transition to the specified bounds.
|
|
115
|
+
*/
|
|
79
116
|
maxZoom?: number;
|
|
80
117
|
}
|
|
81
118
|
|
|
119
|
+
/**
|
|
120
|
+
* The {@link Map#flyTo} options object
|
|
121
|
+
*/
|
|
82
122
|
export type FlyToOptions = AnimationOptions & CameraOptions & {
|
|
123
|
+
/**
|
|
124
|
+
* The zooming "curve" that will occur along the
|
|
125
|
+
* flight path. A high value maximizes zooming for an exaggerated animation, while a low
|
|
126
|
+
* value minimizes zooming for an effect closer to {@link Map#easeTo}. 1.42 is the average
|
|
127
|
+
* value selected by participants in the user study discussed in
|
|
128
|
+
* [van Wijk (2003)](https://www.win.tue.nl/~vanwijk/zoompan.pdf). A value of
|
|
129
|
+
* `Math.pow(6, 0.25)` would be equivalent to the root mean squared average velocity. A
|
|
130
|
+
* value of 1 would produce a circular motion.
|
|
131
|
+
* @defaultValue 1.42
|
|
132
|
+
*/
|
|
83
133
|
curve?: number;
|
|
134
|
+
/**
|
|
135
|
+
* The zero-based zoom level at the peak of the flight path. If
|
|
136
|
+
* `options.curve` is specified, this option is ignored.
|
|
137
|
+
*/
|
|
84
138
|
minZoom?: number;
|
|
139
|
+
/**
|
|
140
|
+
* The average speed of the animation defined in relation to
|
|
141
|
+
* `options.curve`. A speed of 1.2 means that the map appears to move along the flight path
|
|
142
|
+
* by 1.2 times `options.curve` screenfuls every second. A _screenful_ is the map's visible span.
|
|
143
|
+
* It does not correspond to a fixed physical distance, but varies by zoom level.
|
|
144
|
+
* @defaultValue 1.2
|
|
145
|
+
*/
|
|
85
146
|
speed?: number;
|
|
147
|
+
/**
|
|
148
|
+
* The average speed of the animation measured in screenfuls
|
|
149
|
+
* per second, assuming a linear timing curve. If `options.speed` is specified, this option is ignored.
|
|
150
|
+
*/
|
|
86
151
|
screenSpeed?: number;
|
|
152
|
+
/**
|
|
153
|
+
* The animation's maximum duration, measured in milliseconds.
|
|
154
|
+
* If duration exceeds maximum duration, it resets to 0.
|
|
155
|
+
*/
|
|
87
156
|
maxDuration?: number;
|
|
157
|
+
/**
|
|
158
|
+
* The amount of padding in pixels to add to the given bounds.
|
|
159
|
+
*/
|
|
88
160
|
padding?: number | RequireAtLeastOne<PaddingOptions>;
|
|
89
161
|
}
|
|
90
162
|
|
|
@@ -93,12 +165,25 @@ export type EaseToOptions = AnimationOptions & CameraOptions & {
|
|
|
93
165
|
padding?: number | RequireAtLeastOne<PaddingOptions>;
|
|
94
166
|
}
|
|
95
167
|
|
|
168
|
+
/**
|
|
169
|
+
* Options for {@link Map#fitBounds} method
|
|
170
|
+
*/
|
|
96
171
|
export type FitBoundsOptions = FlyToOptions & {
|
|
172
|
+
/**
|
|
173
|
+
* If `true`, the map transitions using {@link Map#easeTo}. If `false`, the map transitions using {@link Map#flyTo}.
|
|
174
|
+
* See those functions and {@link AnimationOptions} for information about options available.
|
|
175
|
+
* @defaultValue false
|
|
176
|
+
*/
|
|
97
177
|
linear?: boolean;
|
|
178
|
+
/**
|
|
179
|
+
* The center of the given bounds relative to the map's center, measured in pixels.
|
|
180
|
+
* @defaultValue [0, 0]
|
|
181
|
+
*/
|
|
98
182
|
offset?: PointLike;
|
|
183
|
+
/**
|
|
184
|
+
* The maximum zoom level to allow when the map view transitions to the specified bounds.
|
|
185
|
+
*/
|
|
99
186
|
maxZoom?: number;
|
|
100
|
-
maxDuration?: number;
|
|
101
|
-
padding?: number | RequireAtLeastOne<PaddingOptions>;
|
|
102
187
|
}
|
|
103
188
|
|
|
104
189
|
/**
|
|
@@ -106,27 +191,41 @@ export type FitBoundsOptions = FlyToOptions & {
|
|
|
106
191
|
* {@link Map#easeTo}, controlling the duration and easing function of the animation. All properties
|
|
107
192
|
* are optional.
|
|
108
193
|
*
|
|
109
|
-
* @typedef {Object} AnimationOptions
|
|
110
|
-
* @property {number} duration The animation's duration, measured in milliseconds.
|
|
111
|
-
* @property {Function} easing A function taking a time in the range 0..1 and returning a number where 0 is
|
|
112
|
-
* the initial state and 1 is the final state.
|
|
113
|
-
* @property {PointLike} offset of the target center relative to real map container center at the end of animation.
|
|
114
|
-
* @property {boolean} animate If `false`, no animation will occur.
|
|
115
|
-
* @property {boolean} essential If `true`, then the animation is considered essential and will not be affected by
|
|
116
|
-
* [`prefers-reduced-motion`](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion).
|
|
117
|
-
* @property {boolean} freezeElevation Default false. Needed in 3D maps to let the camera stay in a constant
|
|
118
|
-
* height based on sea-level. After the animation finished the zoom-level will be recalculated in respect of
|
|
119
|
-
* the distance from the camera to the center-coordinate-altitude.
|
|
120
194
|
*/
|
|
121
195
|
export type AnimationOptions = {
|
|
196
|
+
/**
|
|
197
|
+
* The animation's duration, measured in milliseconds.
|
|
198
|
+
*/
|
|
122
199
|
duration?: number;
|
|
200
|
+
/**
|
|
201
|
+
* A function taking a time in the range 0..1 and returning a number where 0 is
|
|
202
|
+
* the initial state and 1 is the final state.
|
|
203
|
+
*/
|
|
123
204
|
easing?: (_: number) => number;
|
|
205
|
+
/**
|
|
206
|
+
* of the target center relative to real map container center at the end of animation.
|
|
207
|
+
*/
|
|
124
208
|
offset?: PointLike;
|
|
209
|
+
/**
|
|
210
|
+
* If `false`, no animation will occur.
|
|
211
|
+
*/
|
|
125
212
|
animate?: boolean;
|
|
213
|
+
/**
|
|
214
|
+
* If `true`, then the animation is considered essential and will not be affected by
|
|
215
|
+
* [`prefers-reduced-motion`](https://developer.mozilla.org/en-US/docs/Web/CSS/\@media/prefers-reduced-motion).
|
|
216
|
+
*/
|
|
126
217
|
essential?: boolean;
|
|
218
|
+
/**
|
|
219
|
+
* Default false. Needed in 3D maps to let the camera stay in a constant
|
|
220
|
+
* height based on sea-level. After the animation finished the zoom-level will be recalculated in respect of
|
|
221
|
+
* the distance from the camera to the center-coordinate-altitude.
|
|
222
|
+
*/
|
|
127
223
|
freezeElevation?: boolean;
|
|
128
224
|
};
|
|
129
225
|
|
|
226
|
+
/**
|
|
227
|
+
* A callback hook that allows manipulating the camera and being notified about camera updates before they happen
|
|
228
|
+
*/
|
|
130
229
|
export type CameraUpdateTransformFunction = (next: {
|
|
131
230
|
center: LngLat;
|
|
132
231
|
zoom: number;
|
|
@@ -141,7 +240,7 @@ export type CameraUpdateTransformFunction = (next: {
|
|
|
141
240
|
elevation?: number;
|
|
142
241
|
};
|
|
143
242
|
|
|
144
|
-
abstract class Camera extends Evented {
|
|
243
|
+
export abstract class Camera extends Evented {
|
|
145
244
|
transform: Transform;
|
|
146
245
|
terrain: Terrain;
|
|
147
246
|
|
|
@@ -192,9 +291,6 @@ abstract class Camera extends Evented {
|
|
|
192
291
|
this.transform = transform;
|
|
193
292
|
this._bearingSnap = options.bearingSnap;
|
|
194
293
|
|
|
195
|
-
bindAll(['_renderFrameCallback'], this);
|
|
196
|
-
|
|
197
|
-
//addAssertions(this);
|
|
198
294
|
this.on('moveend', () => {
|
|
199
295
|
delete this._requestedCameraState;
|
|
200
296
|
});
|
|
@@ -203,27 +299,29 @@ abstract class Camera extends Evented {
|
|
|
203
299
|
/**
|
|
204
300
|
* Returns the map's geographical centerpoint.
|
|
205
301
|
*
|
|
206
|
-
* @memberof Map#
|
|
207
302
|
* @returns The map's geographical centerpoint.
|
|
208
303
|
* @example
|
|
209
|
-
*
|
|
210
|
-
*
|
|
304
|
+
* Return a LngLat object such as `{lng: 0, lat: 0}`
|
|
305
|
+
* ```ts
|
|
306
|
+
* let center = map.getCenter();
|
|
211
307
|
* // access longitude and latitude values directly
|
|
212
|
-
*
|
|
308
|
+
* let {lng, lat} = map.getCenter();
|
|
309
|
+
* ```
|
|
213
310
|
*/
|
|
214
311
|
getCenter(): LngLat { return new LngLat(this.transform.center.lng, this.transform.center.lat); }
|
|
215
312
|
|
|
216
313
|
/**
|
|
217
314
|
* Sets the map's geographical centerpoint. Equivalent to `jumpTo({center: center})`.
|
|
218
315
|
*
|
|
219
|
-
* @
|
|
220
|
-
* @param
|
|
221
|
-
* @
|
|
222
|
-
* @
|
|
223
|
-
* @
|
|
224
|
-
* @returns {Map} `this`
|
|
316
|
+
* @param center - The centerpoint to set.
|
|
317
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
318
|
+
* @event `movestart`
|
|
319
|
+
* @event `moveend`
|
|
320
|
+
* @returns `this`
|
|
225
321
|
* @example
|
|
322
|
+
* ```ts
|
|
226
323
|
* map.setCenter([-74, 38]);
|
|
324
|
+
* ```
|
|
227
325
|
*/
|
|
228
326
|
setCenter(center: LngLatLike, eventData?: any) {
|
|
229
327
|
return this.jumpTo({center}, eventData);
|
|
@@ -232,16 +330,15 @@ abstract class Camera extends Evented {
|
|
|
232
330
|
/**
|
|
233
331
|
* Pans the map by the specified offset.
|
|
234
332
|
*
|
|
235
|
-
* @
|
|
236
|
-
* @param
|
|
237
|
-
* @param
|
|
238
|
-
* @
|
|
239
|
-
* @
|
|
240
|
-
* @
|
|
241
|
-
* @
|
|
242
|
-
* @see [Navigate the map with game-like controls](https://maplibre.org/maplibre-gl-js-docs/example/game-controls/)
|
|
333
|
+
* @param offset - `x` and `y` coordinates by which to pan the map.
|
|
334
|
+
* @param options - Options object
|
|
335
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
336
|
+
* @event `movestart`
|
|
337
|
+
* @event `moveend`
|
|
338
|
+
* @returns `this`
|
|
339
|
+
* @see [Navigate the map with game-like controls](https://maplibre.org/maplibre-gl-js/docs/examples/game-controls/)
|
|
243
340
|
*/
|
|
244
|
-
panBy(offset: PointLike, options?: AnimationOptions, eventData?: any) {
|
|
341
|
+
panBy(offset: PointLike, options?: AnimationOptions, eventData?: any): this {
|
|
245
342
|
offset = Point.convert(offset).mult(-1);
|
|
246
343
|
return this.panTo(this.transform.center, extend({offset}, options), eventData);
|
|
247
344
|
}
|
|
@@ -249,21 +346,21 @@ abstract class Camera extends Evented {
|
|
|
249
346
|
/**
|
|
250
347
|
* Pans the map to the specified location with an animated transition.
|
|
251
348
|
*
|
|
252
|
-
* @
|
|
253
|
-
* @param
|
|
254
|
-
* @param
|
|
255
|
-
* @
|
|
256
|
-
* @
|
|
257
|
-
* @
|
|
258
|
-
* @returns {Map} `this`
|
|
349
|
+
* @param lnglat - The location to pan the map to.
|
|
350
|
+
* @param options - Options describing the destination and animation of the transition.
|
|
351
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
352
|
+
* @event `movestart`
|
|
353
|
+
* @event `moveend`
|
|
354
|
+
* @returns `this`
|
|
259
355
|
* @example
|
|
356
|
+
* ```ts
|
|
260
357
|
* map.panTo([-74, 38]);
|
|
261
|
-
* @example
|
|
262
358
|
* // Specify that the panTo animation should last 5000 milliseconds.
|
|
263
359
|
* map.panTo([-74, 38], {duration: 5000});
|
|
264
|
-
*
|
|
360
|
+
* ```
|
|
361
|
+
* @see [Update a feature in realtime](https://maplibre.org/maplibre-gl-js/docs/examples/live-update-feature/)
|
|
265
362
|
*/
|
|
266
|
-
panTo(lnglat: LngLatLike, options?: AnimationOptions, eventData?: any) {
|
|
363
|
+
panTo(lnglat: LngLatLike, options?: AnimationOptions, eventData?: any): this {
|
|
267
364
|
return this.easeTo(extend({
|
|
268
365
|
center: lnglat
|
|
269
366
|
}, options), eventData);
|
|
@@ -272,31 +369,33 @@ abstract class Camera extends Evented {
|
|
|
272
369
|
/**
|
|
273
370
|
* Returns the map's current zoom level.
|
|
274
371
|
*
|
|
275
|
-
* @memberof Map#
|
|
276
372
|
* @returns The map's current zoom level.
|
|
277
373
|
* @example
|
|
374
|
+
* ```ts
|
|
278
375
|
* map.getZoom();
|
|
376
|
+
* ```
|
|
279
377
|
*/
|
|
280
378
|
getZoom(): number { return this.transform.zoom; }
|
|
281
379
|
|
|
282
380
|
/**
|
|
283
381
|
* Sets the map's zoom level. Equivalent to `jumpTo({zoom: zoom})`.
|
|
284
382
|
*
|
|
285
|
-
* @
|
|
286
|
-
* @param
|
|
287
|
-
* @
|
|
288
|
-
* @
|
|
289
|
-
* @
|
|
290
|
-
* @
|
|
291
|
-
* @
|
|
292
|
-
* @
|
|
293
|
-
* @
|
|
294
|
-
* @returns {Map} `this`
|
|
383
|
+
* @param zoom - The zoom level to set (0-20).
|
|
384
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
385
|
+
* @event `movestart`
|
|
386
|
+
* @event `zoomstart`
|
|
387
|
+
* @event `move`
|
|
388
|
+
* @event `zoom`
|
|
389
|
+
* @event `moveend`
|
|
390
|
+
* @event `zoomend`
|
|
391
|
+
* @returns `this`
|
|
295
392
|
* @example
|
|
296
|
-
*
|
|
393
|
+
* Zoom to the zoom level 5 without an animated transition
|
|
394
|
+
* ```ts
|
|
297
395
|
* map.setZoom(5);
|
|
396
|
+
* ```
|
|
298
397
|
*/
|
|
299
|
-
setZoom(zoom: number, eventData?: any) {
|
|
398
|
+
setZoom(zoom: number, eventData?: any): this {
|
|
300
399
|
this.jumpTo({zoom}, eventData);
|
|
301
400
|
return this;
|
|
302
401
|
}
|
|
@@ -304,18 +403,18 @@ abstract class Camera extends Evented {
|
|
|
304
403
|
/**
|
|
305
404
|
* Zooms the map to the specified zoom level, with an animated transition.
|
|
306
405
|
*
|
|
307
|
-
* @
|
|
308
|
-
* @param
|
|
309
|
-
* @param
|
|
310
|
-
* @
|
|
311
|
-
* @
|
|
312
|
-
* @
|
|
313
|
-
* @
|
|
314
|
-
* @
|
|
315
|
-
* @
|
|
316
|
-
* @
|
|
317
|
-
* @returns {Map} `this`
|
|
406
|
+
* @param zoom - The zoom level to transition to.
|
|
407
|
+
* @param options - Options object
|
|
408
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
409
|
+
* @event `movestart`
|
|
410
|
+
* @event `zoomstart`
|
|
411
|
+
* @event `move`
|
|
412
|
+
* @event `zoom`
|
|
413
|
+
* @event `moveend`
|
|
414
|
+
* @event `zoomend`
|
|
415
|
+
* @returns `this`
|
|
318
416
|
* @example
|
|
417
|
+
* ```ts
|
|
319
418
|
* // Zoom to the zoom level 5 without an animated transition
|
|
320
419
|
* map.zoomTo(5);
|
|
321
420
|
* // Zoom to the zoom level 8 with an animated transition
|
|
@@ -323,8 +422,9 @@ abstract class Camera extends Evented {
|
|
|
323
422
|
* duration: 2000,
|
|
324
423
|
* offset: [100, 50]
|
|
325
424
|
* });
|
|
425
|
+
* ```
|
|
326
426
|
*/
|
|
327
|
-
zoomTo(zoom: number, options?: AnimationOptions | null, eventData?: any) {
|
|
427
|
+
zoomTo(zoom: number, options?: AnimationOptions | null, eventData?: any): this {
|
|
328
428
|
return this.easeTo(extend({
|
|
329
429
|
zoom
|
|
330
430
|
}, options), eventData);
|
|
@@ -333,21 +433,22 @@ abstract class Camera extends Evented {
|
|
|
333
433
|
/**
|
|
334
434
|
* Increases the map's zoom level by 1.
|
|
335
435
|
*
|
|
336
|
-
* @
|
|
337
|
-
* @param
|
|
338
|
-
* @
|
|
339
|
-
* @
|
|
340
|
-
* @
|
|
341
|
-
* @
|
|
342
|
-
* @
|
|
343
|
-
* @
|
|
344
|
-
* @
|
|
345
|
-
* @returns {Map} `this`
|
|
436
|
+
* @param options - Options object
|
|
437
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
438
|
+
* @event `movestart`
|
|
439
|
+
* @event `zoomstart`
|
|
440
|
+
* @event `move`
|
|
441
|
+
* @event `zoom`
|
|
442
|
+
* @event `moveend`
|
|
443
|
+
* @event `zoomend`
|
|
444
|
+
* @returns `this`
|
|
346
445
|
* @example
|
|
347
|
-
*
|
|
446
|
+
* Zoom the map in one level with a custom animation duration
|
|
447
|
+
* ```ts
|
|
348
448
|
* map.zoomIn({duration: 1000});
|
|
449
|
+
* ```
|
|
349
450
|
*/
|
|
350
|
-
zoomIn(options?: AnimationOptions, eventData?: any) {
|
|
451
|
+
zoomIn(options?: AnimationOptions, eventData?: any): this {
|
|
351
452
|
this.zoomTo(this.getZoom() + 1, options, eventData);
|
|
352
453
|
return this;
|
|
353
454
|
}
|
|
@@ -355,21 +456,22 @@ abstract class Camera extends Evented {
|
|
|
355
456
|
/**
|
|
356
457
|
* Decreases the map's zoom level by 1.
|
|
357
458
|
*
|
|
358
|
-
* @
|
|
359
|
-
* @param
|
|
360
|
-
* @
|
|
361
|
-
* @
|
|
362
|
-
* @
|
|
363
|
-
* @
|
|
364
|
-
* @
|
|
365
|
-
* @
|
|
366
|
-
* @
|
|
367
|
-
* @returns {Map} `this`
|
|
459
|
+
* @param options - Options object
|
|
460
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
461
|
+
* @event `movestart`
|
|
462
|
+
* @event `zoomstart`
|
|
463
|
+
* @event `move`
|
|
464
|
+
* @event `zoom`
|
|
465
|
+
* @event `moveend`
|
|
466
|
+
* @event `zoomend`
|
|
467
|
+
* @returns `this`
|
|
368
468
|
* @example
|
|
369
|
-
*
|
|
469
|
+
* Zoom the map out one level with a custom animation offset
|
|
470
|
+
* ```ts
|
|
370
471
|
* map.zoomOut({offset: [80, 60]});
|
|
472
|
+
* ```
|
|
371
473
|
*/
|
|
372
|
-
zoomOut(options?: AnimationOptions, eventData?: any) {
|
|
474
|
+
zoomOut(options?: AnimationOptions, eventData?: any): this {
|
|
373
475
|
this.zoomTo(this.getZoom() - 1, options, eventData);
|
|
374
476
|
return this;
|
|
375
477
|
}
|
|
@@ -378,9 +480,8 @@ abstract class Camera extends Evented {
|
|
|
378
480
|
* Returns the map's current bearing. The bearing is the compass direction that is "up"; for example, a bearing
|
|
379
481
|
* of 90° orients the map so that east is up.
|
|
380
482
|
*
|
|
381
|
-
* @memberof Map#
|
|
382
483
|
* @returns The map's current bearing.
|
|
383
|
-
* @see [Navigate the map with game-like controls](https://maplibre.org/maplibre-gl-js
|
|
484
|
+
* @see [Navigate the map with game-like controls](https://maplibre.org/maplibre-gl-js/docs/examples/game-controls/)
|
|
384
485
|
*/
|
|
385
486
|
getBearing(): number { return this.transform.bearing; }
|
|
386
487
|
|
|
@@ -390,17 +491,18 @@ abstract class Camera extends Evented {
|
|
|
390
491
|
*
|
|
391
492
|
* Equivalent to `jumpTo({bearing: bearing})`.
|
|
392
493
|
*
|
|
393
|
-
* @
|
|
394
|
-
* @param
|
|
395
|
-
* @
|
|
396
|
-
* @
|
|
397
|
-
* @
|
|
398
|
-
* @returns {Map} `this`
|
|
494
|
+
* @param bearing - The desired bearing.
|
|
495
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
496
|
+
* @event `movestart`
|
|
497
|
+
* @event `moveend`
|
|
498
|
+
* @returns `this`
|
|
399
499
|
* @example
|
|
400
|
-
*
|
|
500
|
+
* Rotate the map to 90 degrees
|
|
501
|
+
* ```ts
|
|
401
502
|
* map.setBearing(90);
|
|
503
|
+
* ```
|
|
402
504
|
*/
|
|
403
|
-
setBearing(bearing: number, eventData?: any) {
|
|
505
|
+
setBearing(bearing: number, eventData?: any): this {
|
|
404
506
|
this.jumpTo({bearing}, eventData);
|
|
405
507
|
return this;
|
|
406
508
|
}
|
|
@@ -408,7 +510,6 @@ abstract class Camera extends Evented {
|
|
|
408
510
|
/**
|
|
409
511
|
* Returns the current padding applied around the map viewport.
|
|
410
512
|
*
|
|
411
|
-
* @memberof Map#
|
|
412
513
|
* @returns The current padding around the map viewport.
|
|
413
514
|
*/
|
|
414
515
|
getPadding(): PaddingOptions { return this.transform.padding; }
|
|
@@ -418,34 +519,34 @@ abstract class Camera extends Evented {
|
|
|
418
519
|
*
|
|
419
520
|
* Equivalent to `jumpTo({padding: padding})`.
|
|
420
521
|
*
|
|
421
|
-
* @
|
|
422
|
-
* @param
|
|
423
|
-
* @
|
|
424
|
-
* @
|
|
425
|
-
* @
|
|
426
|
-
* @returns {Map} `this`
|
|
522
|
+
* @param padding - The desired padding.
|
|
523
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
524
|
+
* @event `movestart`
|
|
525
|
+
* @event `moveend`
|
|
526
|
+
* @returns `this`
|
|
427
527
|
* @example
|
|
428
|
-
*
|
|
528
|
+
* Sets a left padding of 300px, and a top padding of 50px
|
|
529
|
+
* ```ts
|
|
429
530
|
* map.setPadding({ left: 300, top: 50 });
|
|
531
|
+
* ```
|
|
430
532
|
*/
|
|
431
|
-
setPadding(padding: PaddingOptions, eventData?: any) {
|
|
533
|
+
setPadding(padding: PaddingOptions, eventData?: any): this {
|
|
432
534
|
this.jumpTo({padding}, eventData);
|
|
433
535
|
return this;
|
|
434
536
|
}
|
|
435
537
|
|
|
436
538
|
/**
|
|
437
539
|
* Rotates the map to the specified bearing, with an animated transition. The bearing is the compass direction
|
|
438
|
-
* that is
|
|
540
|
+
* that is "up"; for example, a bearing of 90° orients the map so that east is up.
|
|
439
541
|
*
|
|
440
|
-
* @
|
|
441
|
-
* @param
|
|
442
|
-
* @param
|
|
443
|
-
* @
|
|
444
|
-
* @
|
|
445
|
-
* @
|
|
446
|
-
* @returns {Map} `this`
|
|
542
|
+
* @param bearing - The desired bearing.
|
|
543
|
+
* @param options - Options object
|
|
544
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
545
|
+
* @event `movestart`
|
|
546
|
+
* @event `moveend`
|
|
547
|
+
* @returns `this`
|
|
447
548
|
*/
|
|
448
|
-
rotateTo(bearing: number, options?: AnimationOptions, eventData?: any) {
|
|
549
|
+
rotateTo(bearing: number, options?: AnimationOptions, eventData?: any): this {
|
|
449
550
|
return this.easeTo(extend({
|
|
450
551
|
bearing
|
|
451
552
|
}, options), eventData);
|
|
@@ -454,14 +555,13 @@ abstract class Camera extends Evented {
|
|
|
454
555
|
/**
|
|
455
556
|
* Rotates the map so that north is up (0° bearing), with an animated transition.
|
|
456
557
|
*
|
|
457
|
-
* @
|
|
458
|
-
* @param
|
|
459
|
-
* @
|
|
460
|
-
* @
|
|
461
|
-
* @
|
|
462
|
-
* @returns {Map} `this`
|
|
558
|
+
* @param options - Options object
|
|
559
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
560
|
+
* @event `movestart`
|
|
561
|
+
* @event `moveend`
|
|
562
|
+
* @returns `this`
|
|
463
563
|
*/
|
|
464
|
-
resetNorth(options?: AnimationOptions, eventData?: any) {
|
|
564
|
+
resetNorth(options?: AnimationOptions, eventData?: any): this {
|
|
465
565
|
this.rotateTo(0, extend({duration: 1000}, options), eventData);
|
|
466
566
|
return this;
|
|
467
567
|
}
|
|
@@ -469,14 +569,13 @@ abstract class Camera extends Evented {
|
|
|
469
569
|
/**
|
|
470
570
|
* Rotates and pitches the map so that north is up (0° bearing) and pitch is 0°, with an animated transition.
|
|
471
571
|
*
|
|
472
|
-
* @
|
|
473
|
-
* @param
|
|
474
|
-
* @
|
|
475
|
-
* @
|
|
476
|
-
* @
|
|
477
|
-
* @returns {Map} `this`
|
|
572
|
+
* @param options - Options object
|
|
573
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
574
|
+
* @event `movestart`
|
|
575
|
+
* @event `moveend`
|
|
576
|
+
* @returns `this`
|
|
478
577
|
*/
|
|
479
|
-
resetNorthPitch(options?: AnimationOptions, eventData?: any) {
|
|
578
|
+
resetNorthPitch(options?: AnimationOptions, eventData?: any): this {
|
|
480
579
|
this.easeTo(extend({
|
|
481
580
|
bearing: 0,
|
|
482
581
|
pitch: 0,
|
|
@@ -489,14 +588,13 @@ abstract class Camera extends Evented {
|
|
|
489
588
|
* Snaps the map so that north is up (0° bearing), if the current bearing is close enough to it (i.e. within the
|
|
490
589
|
* `bearingSnap` threshold).
|
|
491
590
|
*
|
|
492
|
-
* @
|
|
493
|
-
* @param
|
|
494
|
-
* @
|
|
495
|
-
* @
|
|
496
|
-
* @
|
|
497
|
-
* @returns {Map} `this`
|
|
591
|
+
* @param options - Options object
|
|
592
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
593
|
+
* @event `movestart`
|
|
594
|
+
* @event `moveend`
|
|
595
|
+
* @returns `this`
|
|
498
596
|
*/
|
|
499
|
-
snapToNorth(options?: AnimationOptions, eventData?: any) {
|
|
597
|
+
snapToNorth(options?: AnimationOptions, eventData?: any): this {
|
|
500
598
|
if (Math.abs(this.getBearing()) < this._bearingSnap) {
|
|
501
599
|
return this.resetNorth(options, eventData);
|
|
502
600
|
}
|
|
@@ -506,7 +604,6 @@ abstract class Camera extends Evented {
|
|
|
506
604
|
/**
|
|
507
605
|
* Returns the map's current pitch (tilt).
|
|
508
606
|
*
|
|
509
|
-
* @memberof Map#
|
|
510
607
|
* @returns The map's current pitch, measured in degrees away from the plane of the screen.
|
|
511
608
|
*/
|
|
512
609
|
getPitch(): number { return this.transform.pitch; }
|
|
@@ -514,36 +611,32 @@ abstract class Camera extends Evented {
|
|
|
514
611
|
/**
|
|
515
612
|
* Sets the map's pitch (tilt). Equivalent to `jumpTo({pitch: pitch})`.
|
|
516
613
|
*
|
|
517
|
-
* @
|
|
518
|
-
* @param
|
|
519
|
-
* @
|
|
520
|
-
* @
|
|
521
|
-
* @
|
|
522
|
-
* @
|
|
523
|
-
* @returns {Map} `this`
|
|
614
|
+
* @param pitch - The pitch to set, measured in degrees away from the plane of the screen (0-60).
|
|
615
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
616
|
+
* @event `pitchstart`
|
|
617
|
+
* @event `movestart`
|
|
618
|
+
* @event `moveend`
|
|
619
|
+
* @returns `this`
|
|
524
620
|
*/
|
|
525
|
-
setPitch(pitch: number, eventData?: any) {
|
|
621
|
+
setPitch(pitch: number, eventData?: any): this {
|
|
526
622
|
this.jumpTo({pitch}, eventData);
|
|
527
623
|
return this;
|
|
528
624
|
}
|
|
529
625
|
|
|
530
626
|
/**
|
|
531
|
-
* @
|
|
532
|
-
* @param {LngLatBoundsLike} bounds Calculate the center for these bounds in the viewport and use
|
|
627
|
+
* @param bounds - Calculate the center for these bounds in the viewport and use
|
|
533
628
|
* the highest zoom level up to and including `Map#getMaxZoom()` that fits
|
|
534
629
|
* in the viewport. LngLatBounds represent a box that is always axis-aligned with bearing 0.
|
|
535
|
-
* @param options Options object
|
|
536
|
-
* @
|
|
537
|
-
* @param {number} [options.bearing=0] Desired map bearing at end of animation, in degrees.
|
|
538
|
-
* @param {PointLike} [options.offset=[0, 0]] The center of the given bounds relative to the map's center, measured in pixels.
|
|
539
|
-
* @param {number} [options.maxZoom] The maximum zoom level to allow when the camera would transition to the specified bounds.
|
|
540
|
-
* @returns {CenterZoomBearing} If map is able to fit to provided bounds, returns `center`, `zoom`, and `bearing`.
|
|
630
|
+
* @param options - Options object
|
|
631
|
+
* @returns If map is able to fit to provided bounds, returns `center`, `zoom`, and `bearing`.
|
|
541
632
|
* If map is unable to fit, method will warn and return undefined.
|
|
542
633
|
* @example
|
|
543
|
-
*
|
|
544
|
-
*
|
|
634
|
+
* ```ts
|
|
635
|
+
* let bbox = [[-79, 43], [-73, 45]];
|
|
636
|
+
* let newCameraTransform = map.cameraForBounds(bbox, {
|
|
545
637
|
* padding: {top: 10, bottom:25, left: 15, right: 5}
|
|
546
638
|
* });
|
|
639
|
+
* ```
|
|
547
640
|
*/
|
|
548
641
|
cameraForBounds(bounds: LngLatBoundsLike, options?: CameraForBoundsOptions): CenterZoomBearing {
|
|
549
642
|
bounds = LngLatBounds.convert(bounds);
|
|
@@ -555,24 +648,22 @@ abstract class Camera extends Evented {
|
|
|
555
648
|
* Calculate the center of these two points in the viewport and use
|
|
556
649
|
* the highest zoom level up to and including `Map#getMaxZoom()` that fits
|
|
557
650
|
* the points in the viewport at the specified bearing.
|
|
558
|
-
* @
|
|
559
|
-
* @param
|
|
560
|
-
* @param
|
|
561
|
-
* @param
|
|
562
|
-
* @
|
|
563
|
-
* @param {number | PaddingOptions} [options.padding] The amount of padding in pixels to add to the given bounds.
|
|
564
|
-
* @param {PointLike} [options.offset=[0, 0]] The center of the given bounds relative to the map's center, measured in pixels.
|
|
565
|
-
* @param {number} [options.maxZoom] The maximum zoom level to allow when the camera would transition to the specified bounds.
|
|
566
|
-
* @returns {CenterZoomBearing} If map is able to fit to provided bounds, returns `center`, `zoom`, and `bearing`.
|
|
651
|
+
* @param p0 - First point
|
|
652
|
+
* @param p1 - Second point
|
|
653
|
+
* @param bearing - Desired map bearing at end of animation, in degrees
|
|
654
|
+
* @param options - the camera options
|
|
655
|
+
* @returns If map is able to fit to provided bounds, returns `center`, `zoom`, and `bearing`.
|
|
567
656
|
* If map is unable to fit, method will warn and return undefined.
|
|
568
|
-
* @
|
|
657
|
+
* @hidden
|
|
569
658
|
* @example
|
|
570
|
-
*
|
|
571
|
-
*
|
|
572
|
-
*
|
|
573
|
-
*
|
|
659
|
+
* ```ts
|
|
660
|
+
* let p0 = [-79, 43];
|
|
661
|
+
* let p1 = [-73, 45];
|
|
662
|
+
* let bearing = 90;
|
|
663
|
+
* let newCameraTransform = map._cameraForBoxAndBearing(p0, p1, bearing, {
|
|
574
664
|
* padding: {top: 10, bottom:25, left: 15, right: 5}
|
|
575
665
|
* });
|
|
666
|
+
* ```
|
|
576
667
|
*/
|
|
577
668
|
_cameraForBoxAndBearing(p0: LngLatLike, p1: LngLatLike, bearing: number, options?: CameraForBoundsOptions): CenterZoomBearing {
|
|
578
669
|
const defaultPadding = {
|
|
@@ -647,29 +738,23 @@ abstract class Camera extends Evented {
|
|
|
647
738
|
* Pans and zooms the map to contain its visible area within the specified geographical bounds.
|
|
648
739
|
* This function will also reset the map's bearing to 0 if bearing is nonzero.
|
|
649
740
|
*
|
|
650
|
-
* @
|
|
651
|
-
* @param bounds Center these bounds in the viewport and use the highest
|
|
741
|
+
* @param bounds - Center these bounds in the viewport and use the highest
|
|
652
742
|
* zoom level up to and including `Map#getMaxZoom()` that fits them in the viewport.
|
|
653
|
-
* @param
|
|
654
|
-
* @param
|
|
655
|
-
* @
|
|
656
|
-
*
|
|
657
|
-
*
|
|
658
|
-
* @param {Function} [options.easing] An easing function for the animated transition. See {@link AnimationOptions}.
|
|
659
|
-
* @param {PointLike} [options.offset=[0, 0]] The center of the given bounds relative to the map's center, measured in pixels.
|
|
660
|
-
* @param {number} [options.maxZoom] The maximum zoom level to allow when the map view transitions to the specified bounds.
|
|
661
|
-
* @param {Object} [eventData] Additional properties to be added to event objects of events triggered by this method.
|
|
662
|
-
* @fires movestart
|
|
663
|
-
* @fires moveend
|
|
664
|
-
* @returns {Map} `this`
|
|
743
|
+
* @param options- Options supports all properties from {@link AnimationOptions} and {@link CameraOptions} in addition to the fields below.
|
|
744
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
745
|
+
* @event `movestart`
|
|
746
|
+
* @event `moveend`
|
|
747
|
+
* @returns `this`
|
|
665
748
|
* @example
|
|
666
|
-
*
|
|
749
|
+
* ```ts
|
|
750
|
+
* let bbox = [[-79, 43], [-73, 45]];
|
|
667
751
|
* map.fitBounds(bbox, {
|
|
668
752
|
* padding: {top: 10, bottom:25, left: 15, right: 5}
|
|
669
753
|
* });
|
|
670
|
-
*
|
|
754
|
+
* ```
|
|
755
|
+
* @see [Fit a map to a bounding box](https://maplibre.org/maplibre-gl-js/docs/examples/fitbounds/)
|
|
671
756
|
*/
|
|
672
|
-
fitBounds(bounds: LngLatBoundsLike, options?: FitBoundsOptions, eventData?: any) {
|
|
757
|
+
fitBounds(bounds: LngLatBoundsLike, options?: FitBoundsOptions, eventData?: any): this {
|
|
673
758
|
return this._fitInternal(
|
|
674
759
|
this.cameraForBounds(bounds, options),
|
|
675
760
|
options,
|
|
@@ -681,31 +766,25 @@ abstract class Camera extends Evented {
|
|
|
681
766
|
* once the map is rotated to the specified bearing. To zoom without rotating,
|
|
682
767
|
* pass in the current map bearing.
|
|
683
768
|
*
|
|
684
|
-
* @
|
|
685
|
-
* @param
|
|
686
|
-
* @param
|
|
687
|
-
* @param
|
|
688
|
-
* @param
|
|
689
|
-
* @
|
|
690
|
-
* @
|
|
691
|
-
*
|
|
692
|
-
* those functions and {@link AnimationOptions} for information about options available.
|
|
693
|
-
* @param {Function} [options.easing] An easing function for the animated transition. See {@link AnimationOptions}.
|
|
694
|
-
* @param {PointLike} [options.offset=[0, 0]] The center of the given bounds relative to the map's center, measured in pixels.
|
|
695
|
-
* @param {number} [options.maxZoom] The maximum zoom level to allow when the map view transitions to the specified bounds.
|
|
696
|
-
* @param eventData Additional properties to be added to event objects of events triggered by this method.
|
|
697
|
-
* @fires movestart
|
|
698
|
-
* @fires moveend
|
|
699
|
-
* @returns {Map} `this`
|
|
769
|
+
* @param p0 - First point on screen, in pixel coordinates
|
|
770
|
+
* @param p1 - Second point on screen, in pixel coordinates
|
|
771
|
+
* @param bearing - Desired map bearing at end of animation, in degrees
|
|
772
|
+
* @param options - Options object
|
|
773
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
774
|
+
* @event `movestart`
|
|
775
|
+
* @event `moveend`
|
|
776
|
+
* @returns `this`
|
|
700
777
|
* @example
|
|
701
|
-
*
|
|
702
|
-
*
|
|
778
|
+
* ```ts
|
|
779
|
+
* let p0 = [220, 400];
|
|
780
|
+
* let p1 = [500, 900];
|
|
703
781
|
* map.fitScreenCoordinates(p0, p1, map.getBearing(), {
|
|
704
782
|
* padding: {top: 10, bottom:25, left: 15, right: 5}
|
|
705
783
|
* });
|
|
784
|
+
* ```
|
|
706
785
|
* @see Used by {@link BoxZoomHandler}
|
|
707
786
|
*/
|
|
708
|
-
fitScreenCoordinates(p0: PointLike, p1: PointLike, bearing: number, options?: FitBoundsOptions, eventData?: any) {
|
|
787
|
+
fitScreenCoordinates(p0: PointLike, p1: PointLike, bearing: number, options?: FitBoundsOptions, eventData?: any): this {
|
|
709
788
|
return this._fitInternal(
|
|
710
789
|
this._cameraForBoxAndBearing(
|
|
711
790
|
this.transform.pointLocation(Point.convert(p0)),
|
|
@@ -716,7 +795,7 @@ abstract class Camera extends Evented {
|
|
|
716
795
|
eventData);
|
|
717
796
|
}
|
|
718
797
|
|
|
719
|
-
_fitInternal(calculatedOptions?: CenterZoomBearing, options?: FitBoundsOptions, eventData?: any) {
|
|
798
|
+
_fitInternal(calculatedOptions?: CenterZoomBearing, options?: FitBoundsOptions, eventData?: any): this {
|
|
720
799
|
// cameraForBounds warns + returns undefined if unable to fit:
|
|
721
800
|
if (!calculatedOptions) return this;
|
|
722
801
|
|
|
@@ -734,21 +813,21 @@ abstract class Camera extends Evented {
|
|
|
734
813
|
* an animated transition. The map will retain its current values for any
|
|
735
814
|
* details not specified in `options`.
|
|
736
815
|
*
|
|
737
|
-
* @
|
|
738
|
-
* @param
|
|
739
|
-
* @
|
|
740
|
-
* @
|
|
741
|
-
* @
|
|
742
|
-
* @
|
|
743
|
-
* @
|
|
744
|
-
* @
|
|
745
|
-
* @
|
|
746
|
-
* @
|
|
747
|
-
* @
|
|
748
|
-
* @
|
|
749
|
-
* @
|
|
750
|
-
* @returns {Map} `this`
|
|
816
|
+
* @param options - Options object
|
|
817
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
818
|
+
* @event `movestart`
|
|
819
|
+
* @event `zoomstart`
|
|
820
|
+
* @event `pitchstart`
|
|
821
|
+
* @event `rotate`
|
|
822
|
+
* @event `move`
|
|
823
|
+
* @event `zoom`
|
|
824
|
+
* @event `pitch`
|
|
825
|
+
* @event `moveend`
|
|
826
|
+
* @event `zoomend`
|
|
827
|
+
* @event `pitchend`
|
|
828
|
+
* @returns `this`
|
|
751
829
|
* @example
|
|
830
|
+
* ```ts
|
|
752
831
|
* // jump to coordinates at current zoom
|
|
753
832
|
* map.jumpTo({center: [0, 0]});
|
|
754
833
|
* // jump with zoom, pitch, and bearing options
|
|
@@ -758,10 +837,11 @@ abstract class Camera extends Evented {
|
|
|
758
837
|
* pitch: 45,
|
|
759
838
|
* bearing: 90
|
|
760
839
|
* });
|
|
761
|
-
*
|
|
762
|
-
* @see [
|
|
840
|
+
* ```
|
|
841
|
+
* @see [Jump to a series of locations](https://maplibre.org/maplibre-gl-js/docs/examples/jump-to/)
|
|
842
|
+
* @see [Update a feature in realtime](https://maplibre.org/maplibre-gl-js/docs/examples/live-update-feature/)
|
|
763
843
|
*/
|
|
764
|
-
jumpTo(options: JumpToOptions, eventData?: any) {
|
|
844
|
+
jumpTo(options: JumpToOptions, eventData?: any): this {
|
|
765
845
|
this.stop();
|
|
766
846
|
|
|
767
847
|
const tr = this._getTransformForUpdate();
|
|
@@ -818,16 +898,15 @@ abstract class Camera extends Evented {
|
|
|
818
898
|
}
|
|
819
899
|
|
|
820
900
|
/**
|
|
821
|
-
* Calculates pitch, zoom and bearing for looking at
|
|
822
|
-
* and returns them as
|
|
823
|
-
* @
|
|
824
|
-
* @param
|
|
825
|
-
* @param
|
|
826
|
-
* @param
|
|
827
|
-
* @
|
|
828
|
-
* @returns {CameraOptions} the calculated camera options
|
|
901
|
+
* Calculates pitch, zoom and bearing for looking at `newCenter` with the camera position being `newCenter`
|
|
902
|
+
* and returns them as {@link CameraOptions}.
|
|
903
|
+
* @param from - The camera to look from
|
|
904
|
+
* @param altitudeFrom - The altitude of the camera to look from
|
|
905
|
+
* @param to - The center to look at
|
|
906
|
+
* @param altitudeTo - Optional altitude of the center to look at. If none given the ground height will be used.
|
|
907
|
+
* @returns the calculated camera options
|
|
829
908
|
*/
|
|
830
|
-
calculateCameraOptionsFromTo(from: LngLat, altitudeFrom: number, to: LngLat, altitudeTo: number = 0)
|
|
909
|
+
calculateCameraOptionsFromTo(from: LngLat, altitudeFrom: number, to: LngLat, altitudeTo: number = 0): CameraOptions {
|
|
831
910
|
const fromMerc = MercatorCoordinate.fromLngLat(from, altitudeFrom);
|
|
832
911
|
const toMerc = MercatorCoordinate.fromLngLat(to, altitudeTo);
|
|
833
912
|
const dx = toMerc.x - fromMerc.x;
|
|
@@ -861,27 +940,26 @@ abstract class Camera extends Evented {
|
|
|
861
940
|
* the `reduced motion` accessibility feature enabled in their operating system,
|
|
862
941
|
* unless `options` includes `essential: true`.
|
|
863
942
|
*
|
|
864
|
-
* @
|
|
865
|
-
* @param options Options describing the destination and animation of the transition.
|
|
943
|
+
* @param options - Options describing the destination and animation of the transition.
|
|
866
944
|
* Accepts {@link CameraOptions} and {@link AnimationOptions}.
|
|
867
|
-
* @param eventData Additional properties to be added to event objects of events triggered by this method.
|
|
868
|
-
* @
|
|
869
|
-
* @
|
|
870
|
-
* @
|
|
871
|
-
* @
|
|
872
|
-
* @
|
|
873
|
-
* @
|
|
874
|
-
* @
|
|
875
|
-
* @
|
|
876
|
-
* @
|
|
877
|
-
* @
|
|
878
|
-
* @returns
|
|
879
|
-
* @see [Navigate the map with game-like controls](https://maplibre.org/maplibre-gl-js
|
|
945
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
946
|
+
* @event `movestart`
|
|
947
|
+
* @event `zoomstart`
|
|
948
|
+
* @event `pitchstart`
|
|
949
|
+
* @event `rotate`
|
|
950
|
+
* @event `move`
|
|
951
|
+
* @event `zoom`
|
|
952
|
+
* @event `pitch`
|
|
953
|
+
* @event `moveend`
|
|
954
|
+
* @event `zoomend`
|
|
955
|
+
* @event `pitchend`
|
|
956
|
+
* @returns `this`
|
|
957
|
+
* @see [Navigate the map with game-like controls](https://maplibre.org/maplibre-gl-js/docs/examples/game-controls/)
|
|
880
958
|
*/
|
|
881
959
|
easeTo(options: EaseToOptions & {
|
|
882
960
|
easeId?: string;
|
|
883
961
|
noMoveStart?: boolean;
|
|
884
|
-
}, eventData?: any) {
|
|
962
|
+
}, eventData?: any): this {
|
|
885
963
|
this._stop(false, options.easeId);
|
|
886
964
|
|
|
887
965
|
options = extend({
|
|
@@ -1037,7 +1115,7 @@ abstract class Camera extends Evented {
|
|
|
1037
1115
|
|
|
1038
1116
|
/**
|
|
1039
1117
|
* Called after the camera is done being manipulated.
|
|
1040
|
-
* @param
|
|
1118
|
+
* @param tr - the requested camera end state
|
|
1041
1119
|
* Call `transformCameraUpdate` if present, and then apply the "approved" changes.
|
|
1042
1120
|
*/
|
|
1043
1121
|
_applyUpdatedTransform(tr: Transform) {
|
|
@@ -1110,40 +1188,23 @@ abstract class Camera extends Evented {
|
|
|
1110
1188
|
* if the user has the `reduced motion` accessibility feature enabled in their operating system,
|
|
1111
1189
|
* unless 'options' includes `essential: true`.
|
|
1112
1190
|
*
|
|
1113
|
-
* @
|
|
1114
|
-
* @param {FlyToOptions} options Options describing the destination and animation of the transition.
|
|
1191
|
+
* @param options - Options describing the destination and animation of the transition.
|
|
1115
1192
|
* Accepts {@link CameraOptions}, {@link AnimationOptions},
|
|
1116
1193
|
* and the following additional options.
|
|
1117
|
-
* @param
|
|
1118
|
-
*
|
|
1119
|
-
*
|
|
1120
|
-
*
|
|
1121
|
-
*
|
|
1122
|
-
*
|
|
1123
|
-
*
|
|
1124
|
-
* @
|
|
1125
|
-
* `
|
|
1126
|
-
* @
|
|
1127
|
-
* `
|
|
1128
|
-
*
|
|
1129
|
-
* It does not correspond to a fixed physical distance, but varies by zoom level.
|
|
1130
|
-
* @param {number} [options.screenSpeed] The average speed of the animation measured in screenfuls
|
|
1131
|
-
* per second, assuming a linear timing curve. If `options.speed` is specified, this option is ignored.
|
|
1132
|
-
* @param {number} [options.maxDuration] The animation's maximum duration, measured in milliseconds.
|
|
1133
|
-
* If duration exceeds maximum duration, it resets to 0.
|
|
1134
|
-
* @param eventData Additional properties to be added to event objects of events triggered by this method.
|
|
1135
|
-
* @fires movestart
|
|
1136
|
-
* @fires zoomstart
|
|
1137
|
-
* @fires pitchstart
|
|
1138
|
-
* @fires move
|
|
1139
|
-
* @fires zoom
|
|
1140
|
-
* @fires rotate
|
|
1141
|
-
* @fires pitch
|
|
1142
|
-
* @fires moveend
|
|
1143
|
-
* @fires zoomend
|
|
1144
|
-
* @fires pitchend
|
|
1145
|
-
* @returns {Map} `this`
|
|
1194
|
+
* @param eventData - Additional properties to be added to event objects of events triggered by this method.
|
|
1195
|
+
* @event `movestart`
|
|
1196
|
+
* @event `zoomstart`
|
|
1197
|
+
* @event `pitchstart`
|
|
1198
|
+
* @event `move`
|
|
1199
|
+
* @event `zoom`
|
|
1200
|
+
* @event `rotate`
|
|
1201
|
+
* @event `pitch`
|
|
1202
|
+
* @event `moveend`
|
|
1203
|
+
* @event `zoomend`
|
|
1204
|
+
* @event `pitchend`
|
|
1205
|
+
* @returns `this`
|
|
1146
1206
|
* @example
|
|
1207
|
+
* ```ts
|
|
1147
1208
|
* // fly with default options to null island
|
|
1148
1209
|
* map.flyTo({center: [0, 0], zoom: 9});
|
|
1149
1210
|
* // using flyTo options
|
|
@@ -1156,11 +1217,12 @@ abstract class Camera extends Evented {
|
|
|
1156
1217
|
* return t;
|
|
1157
1218
|
* }
|
|
1158
1219
|
* });
|
|
1159
|
-
*
|
|
1160
|
-
* @see [
|
|
1161
|
-
* @see [
|
|
1220
|
+
* ```
|
|
1221
|
+
* @see [Fly to a location](https://maplibre.org/maplibre-gl-js/docs/examples/flyto/)
|
|
1222
|
+
* @see [Slowly fly to a location](https://maplibre.org/maplibre-gl-js/docs/examples/flyto-options/)
|
|
1223
|
+
* @see [Fly to a location based on scroll position](https://maplibre.org/maplibre-gl-js/docs/examples/scroll-fly-to/)
|
|
1162
1224
|
*/
|
|
1163
|
-
flyTo(options: FlyToOptions, eventData?: any) {
|
|
1225
|
+
flyTo(options: FlyToOptions, eventData?: any): this {
|
|
1164
1226
|
// Fall through to jumpTo if user has set prefers-reduced-motion
|
|
1165
1227
|
if (!options.essential && browser.prefersReducedMotion) {
|
|
1166
1228
|
const coercedOptions = pick(options, ['center', 'zoom', 'bearing', 'pitch', 'around']) as CameraOptions;
|
|
@@ -1229,11 +1291,10 @@ abstract class Camera extends Evented {
|
|
|
1229
1291
|
/**
|
|
1230
1292
|
* rᵢ: Returns the zoom-out factor at one end of the animation.
|
|
1231
1293
|
*
|
|
1232
|
-
* @param
|
|
1233
|
-
* @private
|
|
1294
|
+
* @param descent - `true` for the descent, `false` for the ascent
|
|
1234
1295
|
*/
|
|
1235
|
-
function
|
|
1236
|
-
const b = (w1 * w1 - w0 * w0 + (
|
|
1296
|
+
function zoomOutFactor(descent: boolean) {
|
|
1297
|
+
const b = (w1 * w1 - w0 * w0 + (descent ? -1 : 1) * rho2 * rho2 * u1 * u1) / (2 * (descent ? w1 : w0) * rho2 * u1);
|
|
1237
1298
|
return Math.log(Math.sqrt(b * b + 1) - b);
|
|
1238
1299
|
}
|
|
1239
1300
|
|
|
@@ -1242,7 +1303,7 @@ abstract class Camera extends Evented {
|
|
|
1242
1303
|
function tanh(n) { return sinh(n) / cosh(n); }
|
|
1243
1304
|
|
|
1244
1305
|
// r₀: Zoom-out factor during ascent.
|
|
1245
|
-
const r0 =
|
|
1306
|
+
const r0 = zoomOutFactor(false);
|
|
1246
1307
|
|
|
1247
1308
|
// w(s): Returns the visible span on the ground, measured in pixels with respect to the
|
|
1248
1309
|
// initial scale. Assumes an angular field of view of 2 arctan ½ ≈ 53°.
|
|
@@ -1257,7 +1318,7 @@ abstract class Camera extends Evented {
|
|
|
1257
1318
|
};
|
|
1258
1319
|
|
|
1259
1320
|
// S: Total length of the flight path, measured in ρ-screenfuls.
|
|
1260
|
-
let S = (
|
|
1321
|
+
let S = (zoomOutFactor(true) - r0) / rho;
|
|
1261
1322
|
|
|
1262
1323
|
// When u₀ = u₁, the optimal path doesn’t require both ascent and descent.
|
|
1263
1324
|
if (Math.abs(u1) < 0.000001 || !isFinite(S)) {
|
|
@@ -1333,8 +1394,7 @@ abstract class Camera extends Evented {
|
|
|
1333
1394
|
/**
|
|
1334
1395
|
* Stops any animated transition underway.
|
|
1335
1396
|
*
|
|
1336
|
-
* @
|
|
1337
|
-
* @returns {Map} `this`
|
|
1397
|
+
* @returns `this`
|
|
1338
1398
|
*/
|
|
1339
1399
|
stop(): this {
|
|
1340
1400
|
return this._stop();
|
|
@@ -1382,7 +1442,7 @@ abstract class Camera extends Evented {
|
|
|
1382
1442
|
}
|
|
1383
1443
|
|
|
1384
1444
|
// Callback for map._requestRenderFrame
|
|
1385
|
-
_renderFrameCallback() {
|
|
1445
|
+
_renderFrameCallback = () => {
|
|
1386
1446
|
const t = Math.min((browser.now() - this._easeStart) / this._easeOptions.duration, 1);
|
|
1387
1447
|
this._onEaseFrame(this._easeOptions.easing(t));
|
|
1388
1448
|
if (t < 1) {
|
|
@@ -1390,7 +1450,7 @@ abstract class Camera extends Evented {
|
|
|
1390
1450
|
} else {
|
|
1391
1451
|
this.stop();
|
|
1392
1452
|
}
|
|
1393
|
-
}
|
|
1453
|
+
};
|
|
1394
1454
|
|
|
1395
1455
|
// convert bearing so that it's numerically close to the current one so that it interpolates properly
|
|
1396
1456
|
_normalizeBearing(bearing: number, currentBearing: number) {
|
|
@@ -1415,9 +1475,8 @@ abstract class Camera extends Evented {
|
|
|
1415
1475
|
|
|
1416
1476
|
/**
|
|
1417
1477
|
* Query the current elevation of location. It return null if terrain is not enabled. the elevation is in meters relative to mean sea-level
|
|
1418
|
-
* @
|
|
1419
|
-
* @
|
|
1420
|
-
* @returns {number} elevation in meters
|
|
1478
|
+
* @param lngLatLike - [x,y] or LngLat coordinates of the location
|
|
1479
|
+
* @returns elevation in meters
|
|
1421
1480
|
*/
|
|
1422
1481
|
queryTerrainElevation(lngLatLike: LngLatLike): number | null {
|
|
1423
1482
|
if (!this.terrain) {
|
|
@@ -1433,31 +1492,3 @@ abstract class Camera extends Evented {
|
|
|
1433
1492
|
return elevation - this.transform.elevation;
|
|
1434
1493
|
}
|
|
1435
1494
|
}
|
|
1436
|
-
|
|
1437
|
-
// In debug builds, check that camera change events are fired in the correct order.
|
|
1438
|
-
// - ___start events needs to be fired before ___ and ___end events
|
|
1439
|
-
// - another ___start event can't be fired before a ___end event has been fired for the previous one
|
|
1440
|
-
function addAssertions(camera: Camera) { //eslint-disable-line
|
|
1441
|
-
Debug.run(() => {
|
|
1442
|
-
const inProgress = {} as any;
|
|
1443
|
-
|
|
1444
|
-
['drag', 'zoom', 'rotate', 'pitch', 'move'].forEach(name => {
|
|
1445
|
-
inProgress[name] = false;
|
|
1446
|
-
|
|
1447
|
-
camera.on(`${name}start`, () => {
|
|
1448
|
-
inProgress[name] = true;
|
|
1449
|
-
});
|
|
1450
|
-
|
|
1451
|
-
camera.on(`${name}end`, () => {
|
|
1452
|
-
inProgress[name] = false;
|
|
1453
|
-
});
|
|
1454
|
-
});
|
|
1455
|
-
|
|
1456
|
-
// Canary used to test whether this function is stripped in prod build
|
|
1457
|
-
canary = 'canary debug run';
|
|
1458
|
-
});
|
|
1459
|
-
}
|
|
1460
|
-
|
|
1461
|
-
let canary; // eslint-disable-line
|
|
1462
|
-
|
|
1463
|
-
export default Camera;
|