-
Notifications
You must be signed in to change notification settings - Fork 640
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
refactor: 升级新版一方地图交互事件机制,解决抖动问题 (#2521)
* refactor: 升级新版地图交互事件机制 * refactor: 默认升级 MapNext 至 [email protected]
- Loading branch information
Showing
145 changed files
with
17,317 additions
and
365 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
--- | ||
'@antv/l7-map': patch | ||
--- | ||
|
||
refactor: 升级新版一方地图交互事件机制,解决抖动问题 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1 +1,4 @@ | ||
(window as any).URL.createObjectURL = jest.fn; | ||
(window as any).ResizeObserver = jest.fn().mockImplementation(() => ({ | ||
observe: jest.fn(), | ||
})); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,11 +1,32 @@ | ||
# `map` | ||
## Map | ||
|
||
> TODO: description | ||
Map fork from [[email protected]](https://github.com/maplibre/maplibre-gl-js), keep event loop, responds user interaction and updates the internal state of the map (current viewport, camera angle, etc.) | ||
|
||
## Usage | ||
```mermaid | ||
sequenceDiagram | ||
actor user | ||
participant DOM | ||
participant handler_manager | ||
participant handler | ||
participant camera | ||
participant transform | ||
participant map | ||
``` | ||
const map = require('map'); | ||
user->>camera: map#setCenter, map#panTo | ||
camera->>transform: update | ||
camera->>map: fire move event | ||
map->>map: _render() | ||
// TODO: DEMONSTRATE API | ||
user->>DOM: resize, pan,<br>click, scroll,<br>... | ||
DOM->>handler_manager: DOM events | ||
handler_manager->>handler: forward event | ||
handler-->>handler_manager: HandlerResult | ||
handler_manager->>transform: update | ||
handler_manager->>map: fire move event | ||
map->>map: _render() | ||
``` | ||
|
||
- [Transform](./src/geo/transform.ts) holds the current viewport details (pitch, zoom, bearing, bounds, etc.). Two places in the code update transform directly: | ||
- [Camera](./src/camera.ts) (parent class of [Map](./src/map)) in response to explicit calls to [Camera#panTo](./src/camera.ts#L207), [Camera#setCenter](./src/camera.ts#L169) | ||
- [HandlerManager](./src/handler_manager.ts) in response to DOM events. It forwards those events to interaction processors that live in [src/ui/handler](./src/handler), which accumulate a merged [HandlerResult](./src/handler_manager.ts#L64) that kick off a render frame loop, decreasing the inertia and nudging map.transform by that amount on each frame from [HandlerManager#\_updateMapTransform()](./src/handler_manager.ts#L413). That loop continues in the inertia decreases to 0. | ||
- Both camera and handler_manager are responsible for firing `move`, `zoom`, `movestart`, `moveend`, ... events on the map after they update transform. Each of these events (along with style changes and data load events) triggers a call to [Map#\_render()](./src/map.ts#L2480) which renders a single frame of the map. |
Oops, something went wrong.