This documentation provides methods for creating a custom canvas overlay on top of a map. This is useful for more dynamic overlays, like drawing on the map or creating custom animations.
Creating a Custom Overlay
To add a custom overlay, you can use the addLayer method with a type "custom" layer.
Initialization with `onAdd`
The onAdd function is called when the layer is added to the map. Use this to set up any resources your layer will need, like creating a canvas, initializing WebGL, or setting up a 3D scene. This takes two parameters:
- "map" : The map instance, providing access to the map's API.
- "gl" : The WebGL context, particularly important for 3D rendering.
Rendering with `render`
The render function is where the magic happens. It’s called every time to update the visual content of your custom layer. This takes two parameters:
- "gl" : The WebGL context, used if rendering with WebGL.
- "matrix" : The transformation matrix representing the map's current state (e.g., zoom, rotation).
In this function, you draw your custom content on the map, be it a simple 2D graphic or a complex 3D scene
Example