maplibre-gl 3.1.0 → 3.2.0-pre.2

package/src/render/terrain.ts

@@ -1,26 +1,28 @@
 
-import Tile from '../source/tile';
+import {Tile} from '../source/tile';
 import {mat4, vec2} from 'gl-matrix';
 import {OverscaledTileID} from '../source/tile_id';
 import {RGBAImage} from '../util/image';
 import {warnOnce} from '../util/util';
 import {Pos3dArray, TriangleIndexArray} from '../data/array_types.g';
 import pos3dAttributes from '../data/pos3d_attributes';
-import SegmentVector from '../data/segment';
-import VertexBuffer from '../gl/vertex_buffer';
-import IndexBuffer from '../gl/index_buffer';
-import Painter from './painter';
-import Texture from '../render/texture';
-import type Framebuffer from '../gl/framebuffer';
+import {SegmentVector} from '../data/segment';
+import {VertexBuffer} from '../gl/vertex_buffer';
+import {IndexBuffer} from '../gl/index_buffer';
+import {Painter} from './painter';
+import {Texture} from '../render/texture';
+import type {Framebuffer} from '../gl/framebuffer';
 import Point from '@mapbox/point-geometry';
-import MercatorCoordinate from '../geo/mercator_coordinate';
-import TerrainSourceCache from '../source/terrain_source_cache';
-import SourceCache from '../source/source_cache';
-import EXTENT from '../data/extent';
-import {interpolates} from '@maplibre/maplibre-gl-style-spec';
+import {MercatorCoordinate} from '../geo/mercator_coordinate';
+import {TerrainSourceCache} from '../source/terrain_source_cache';
+import {SourceCache} from '../source/source_cache';
+import {EXTENT} from '../data/extent';
 import type {TerrainSpecification} from '@maplibre/maplibre-gl-style-spec';
 import {earthRadius} from '../geo/lng_lat';
 
+/**
+ * A terrain GPU related object
+ */
 export type TerrainData = {
     'u_depth': number;
     'u_terrain': number;
@@ -33,6 +35,9 @@ export type TerrainData = {
     tile: Tile;
 }
 
+/**
+ * A terrain mesh object
+ */
 export type TerrainMesh = {
     indexBuffer: IndexBuffer;
     vertexBuffer: VertexBuffer;
@@ -66,44 +71,69 @@ export type TerrainMesh = {
  *         cache of the last 150 newest rendered tiles.
  *
  */
-
-export default class Terrain {
-    // The style this terrain crresponds to
+export class Terrain {
+    /**
+     * The style this terrain crresponds to
+     */
     painter: Painter;
-    // the sourcecache this terrain is based on
+    /**
+     * the sourcecache this terrain is based on
+     */
     sourceCache: TerrainSourceCache;
-    // the TerrainSpecification object passed to this instance
+    /**
+     * the TerrainSpecification object passed to this instance
+     */
     options: TerrainSpecification;
-    // define the meshSize per tile.
+    /**
+     * define the meshSize per tile.
+     */
     meshSize: number;
-    // multiplicator for the elevation. Used to make terrain more "extreme".
+    /**
+     * multiplicator for the elevation. Used to make terrain more "extreme".
+     */
     exaggeration: number;
-    // to not see pixels in the render-to-texture tiles it is good to render them bigger
-    // this number is the multiplicator (must be a power of 2) for the current tileSize.
-    // So to get good results with not too much memory footprint a value of 2 should be fine.
+    /**
+     * to not see pixels in the render-to-texture tiles it is good to render them bigger
+     * this number is the multiplicator (must be a power of 2) for the current tileSize.
+     * So to get good results with not too much memory footprint a value of 2 should be fine.
+     */
     qualityFactor: number;
-    // holds the framebuffer object in size of the screen to render the coords & depth into a texture.
+    /**
+     * holds the framebuffer object in size of the screen to render the coords & depth into a texture.
+     */
     _fbo: Framebuffer;
     _fboCoordsTexture: Texture;
     _fboDepthTexture: Texture;
     _emptyDepthTexture: Texture;
-    // GL Objects for the terrain-mesh
-    // The mesh is a regular mesh, which has the advantage that it can be reused for all tiles.
+    /**
+     * GL Objects for the terrain-mesh
+     * The mesh is a regular mesh, which has the advantage that it can be reused for all tiles.
+     */
     _mesh: TerrainMesh;
-    // coords index contains a list of tileID.keys. This index is used to identify
-    // the tile via the alpha-cannel in the coords-texture.
-    // As the alpha-channel has 1 Byte a max of 255 tiles can rendered without an error.
+    /**
+     * coords index contains a list of tileID.keys. This index is used to identify
+     * the tile via the alpha-cannel in the coords-texture.
+     * As the alpha-channel has 1 Byte a max of 255 tiles can rendered without an error.
+     */
     coordsIndex: Array<string>;
-    // tile-coords encoded in the rgb channel, _coordsIndex is in the alpha-channel.
+    /**
+     * tile-coords encoded in the rgb channel, _coordsIndex is in the alpha-channel.
+     */
     _coordsTexture: Texture;
-    // accuracy of the coords. 2 * tileSize should be enoughth.
+    /**
+     * accuracy of the coords. 2 * tileSize should be enoughth.
+     */
     _coordsTextureSize: number;
-    // variables for an empty dem texture, which is used while the raster-dem tile is loading.
+    /**
+     * variables for an empty dem texture, which is used while the raster-dem tile is loading.
+     */
     _emptyDemUnpack: number[];
     _emptyDemTexture: Texture;
     _emptyDemMatrix: mat4;
-    // as of overzooming of raster-dem tiles in high zoomlevels, this cache contains
-    // matrices to transform from vector-tile coords to raster-dem-tile coords.
+    /**
+     * as of overzooming of raster-dem tiles in high zoomlevels, this cache contains
+     * matrices to transform from vector-tile coords to raster-dem-tile coords.
+     */
     _demMatrixCache: {[_: string]: { matrix: mat4; coord: OverscaledTileID }};
 
     constructor(painter: Painter, sourceCache: SourceCache, options: TerrainSpecification) {
@@ -120,36 +150,42 @@ export default class Terrain {
 
     /**
      * get the elevation-value from original dem-data for a given tile-coordinate
-     * @param {OverscaledTileID} tileID - the tile to get elevation for
-     * @param {number} x between 0 .. EXTENT
-     * @param {number} y between 0 .. EXTENT
-     * @param {number} extent optional, default 8192
-     * @returns {number} - the elevation
+     * @param tileID - the tile to get elevation for
+     * @param x - between 0 .. EXTENT
+     * @param y - between 0 .. EXTENT
+     * @param extent - optional, default 8192
+     * @returns the elevation
      */
     getDEMElevation(tileID: OverscaledTileID, x: number, y: number, extent: number = EXTENT): number {
         if (!(x >= 0 && x < extent && y >= 0 && y < extent)) return 0;
-        let elevation = 0;
         const terrain = this.getTerrainData(tileID);
-        if (terrain.tile && terrain.tile.dem) {
-            const pos = vec2.transformMat4([] as any, [x / extent * EXTENT, y / extent * EXTENT], terrain.u_terrain_matrix);
-            const coord = [pos[0] * terrain.tile.dem.dim, pos[1] * terrain.tile.dem.dim];
-            const c = [Math.floor(coord[0]), Math.floor(coord[1])];
-            const tl = terrain.tile.dem.get(c[0], c[1]);
-            const tr = terrain.tile.dem.get(c[0], c[1] + 1);
-            const bl = terrain.tile.dem.get(c[0] + 1, c[1]);
-            const br = terrain.tile.dem.get(c[0] + 1, c[1] + 1);
-            elevation = interpolates.number(interpolates.number(tl, tr, coord[0] - c[0]), interpolates.number(bl, br, coord[0] - c[0]), coord[1] - c[1]);
-        }
-        return elevation;
+        const dem = terrain.tile?.dem;
+        if (!dem)
+            return 0;
+
+        const pos = vec2.transformMat4([] as any, [x / extent * EXTENT, y / extent * EXTENT], terrain.u_terrain_matrix);
+        const coord = [pos[0] * dem.dim, pos[1] * dem.dim];
+
+        // bilinear interpolation
+        const cx = Math.floor(coord[0]),
+            cy = Math.floor(coord[1]),
+            tx = coord[0] - cx,
+            ty = coord[1] - cy;
+        return (
+            dem.get(cx, cy) * (1 - tx) * (1 - ty) +
+            dem.get(cx + 1, cy) * (tx) * (1 - ty) +
+            dem.get(cx, cy + 1) * (1 - tx) * (ty) +
+            dem.get(cx + 1, cy + 1) * (tx) * (ty)
+        );
     }
 
     /**
      * get the Elevation for given coordinate in respect of exaggeration.
-     * @param {OverscaledTileID} tileID - the tile id
-     * @param {number} x between 0 .. EXTENT
-     * @param {number} y between 0 .. EXTENT
-     * @param {number} extent optional, default 8192
-     * @returns {number} - the elevation
+     * @param tileID - the tile id
+     * @param x - between 0 .. EXTENT
+     * @param y - between 0 .. EXTENT
+     * @param extent - optional, default 8192
+     * @returns the elevation
      */
     getElevation(tileID: OverscaledTileID, x: number, y: number, extent: number = EXTENT): number {
         return this.getDEMElevation(tileID, x, y, extent) * this.exaggeration;
@@ -157,8 +193,8 @@ export default class Terrain {
 
     /**
      * returns a Terrain Object for a tile. Unless the tile corresponds to data (e.g. tile is loading), return a flat dem object
-     * @param {OverscaledTileID} tileID - the tile to get the terrain for
-     * @returns {TerrainData} the terrain data to use in the program
+     * @param tileID - the tile to get the terrain for
+     * @returns the terrain data to use in the program
      */
     getTerrainData(tileID: OverscaledTileID): TerrainData {
         // create empty DEM Objects, which will used while raster-dem tiles are loading.
@@ -213,8 +249,8 @@ export default class Terrain {
 
     /**
      * get a framebuffer as big as the map-div, which will be used to render depth & coords into a texture
-     * @param {string} texture - the texture
-     * @returns {Framebuffer} the frame buffer
+     * @param texture - the texture
+     * @returns the frame buffer
      */
     getFramebuffer(texture: string): Framebuffer {
         const painter = this.painter;
@@ -252,7 +288,7 @@ export default class Terrain {
      *   - 4 higher bits for x
      *   - 4 higher bits for y
      *   - 8 bits for coordsIndex (1 .. 255) (= number of terraintile), is later setted in draw_terrain uniform value
-     * @returns {Texture} - the texture
+     * @returns the texture
      */
     getCoordsTexture(): Texture {
         const context = this.painter.context;
@@ -273,8 +309,8 @@ export default class Terrain {
 
     /**
      * Reads a pixel from the coords-framebuffer and translate this to mercator.
-     * @param {Point} p Screen-Coordinate
-     * @returns {MercatorCoordinate} mercator coordinate for a screen pixel
+     * @param p - Screen-Coordinate
+     * @returns mercator coordinate for a screen pixel
      */
     pointCoordinate(p: Point): MercatorCoordinate {
         const rgba = new Uint8Array(4);
@@ -300,7 +336,7 @@ export default class Terrain {
 
     /**
      * create a regular mesh which will be used by all terrain-tiles
-     * @returns {TerrainMesh} - the created regular mesh
+     * @returns the created regular mesh
      */
     getTerrainMesh(): TerrainMesh {
         if (this._mesh) return this._mesh;
@@ -347,10 +383,10 @@ export default class Terrain {
     /**
      * Calculates a height of the frame around the terrain-mesh to avoid stiching between
      * tile boundaries in different zoomlevels.
-     * @param zoom current zoomlevel
+     * @param zoom - current zoomlevel
      * @returns the elevation delta in meters
      */
-    getMeshFrameDelta(zoom: number) {
+    getMeshFrameDelta(zoom: number): number {
         // divide by 5 is evaluated by trial & error to get a frame in the right height
         return 2 * Math.PI * earthRadius / Math.pow(2, zoom) / 5;
     }
@@ -359,8 +395,8 @@ export default class Terrain {
      * Get the minimum and maximum elevation contained in a tile. This includes any
      * exaggeration included in the terrain.
      *
-     * @param tileID Id of the tile to be used as a source for the min/max elevation
-     * @returns {Object} Minimum and maximum elevation found in the tile, including the terrain's
+     * @param tileID - ID of the tile to be used as a source for the min/max elevation
+     * @returns the minimum and maximum elevation found in the tile, including the terrain's
      * exaggeration
      */
     getMinMaxElevation(tileID: OverscaledTileID): {minElevation: number | null; maxElevation: number | null} {

package/src/render/texture.ts

@@ -1,4 +1,4 @@
-import type Context from '../gl/context';
+import type {Context} from '../gl/context';
 import type {RGBAImage, AlphaImage} from '../util/image';
 import {isImageBitmap} from '../util/util';
 
@@ -15,7 +15,10 @@ type EmptyImage = {
 type DataTextureImage = RGBAImage | AlphaImage | EmptyImage;
 export type TextureImage = TexImageSource | DataTextureImage;
 
-class Texture {
+/**
+ * A `Texture` GL related object
+ */
+export class Texture {
     context: Context;
     size: [number, number];
     texture: WebGLTexture;
@@ -108,5 +111,3 @@ class Texture {
         this.texture = null;
     }
 }
-
-export default Texture;

package/src/render/uniform_binding.test.ts

@@ -1,5 +1,5 @@
 import {mat4} from 'gl-matrix';
-import Context from '../gl/context';
+import {Context} from '../gl/context';
 import {
     Uniform1i,
     Uniform1f,

package/src/render/uniform_binding.ts

@@ -1,6 +1,6 @@
 import {Color} from '@maplibre/maplibre-gl-style-spec';
 
-import type Context from '../gl/context';
+import type {Context} from '../gl/context';
 import {mat4, vec2, vec3, vec4} from 'gl-matrix';
 
 type $ObjMap<T extends {}, F extends (v: any) => any> = {
@@ -10,6 +10,9 @@ type $ObjMap<T extends {}, F extends (v: any) => any> = {
 export type UniformValues<Us extends {}> = $ObjMap<Us, <V>(u: Uniform<V>) => V>;
 export type UniformLocations = {[_: string]: WebGLUniformLocation};
 
+/**
+ * A base uniform abstract class
+ */
 abstract class Uniform<T> {
     gl: WebGLRenderingContext|WebGL2RenderingContext;
     location: WebGLUniformLocation;
@@ -146,4 +149,7 @@ export {
     UniformMatrix4f
 };
 
+/**
+ * A uniform bindings
+ */
 export type UniformBindings = {[_: string]: Uniform<any>};

package/src/render/update_pattern_positions_in_program.ts

@@ -1,9 +1,9 @@
 import type {CrossFaded} from '../style/properties';
 import type {ResolvedImage} from '@maplibre/maplibre-gl-style-spec';
-import type Tile from '../source/tile';
-import type ProgramConfiguration from '../data/program_configuration';
-import type FillExtrusionStyleLayer from '../style/style_layer/fill_extrusion_style_layer';
-import type FillStyleLayer from '../style/style_layer/fill_style_layer';
+import type {Tile} from '../source/tile';
+import type {ProgramConfiguration} from '../data/program_configuration';
+import type {FillExtrusionStyleLayer} from '../style/style_layer/fill_extrusion_style_layer';
+import type {FillStyleLayer} from '../style/style_layer/fill_style_layer';
 
 /**
  * A simple helper shared by draw_fill and draw_fill_extrusions to find the correct pattern positions AND update program.
@@ -18,7 +18,7 @@ import type FillStyleLayer from '../style/style_layer/fill_style_layer';
  * @param tile - current tile being drawn
  * @param layer - current layer being rendered
  */
-export default function updatePatternPositionsInProgram(
+export function updatePatternPositionsInProgram(
     programConfiguration: ProgramConfiguration,
     propertyName: 'fill-pattern' | 'fill-extrusion-pattern',
     constantPattern: CrossFaded<ResolvedImage>,

package/src/render/vertex_array_object.ts

@@ -1,10 +1,13 @@
 
-import type Program from './program';
-import type VertexBuffer from '../gl/vertex_buffer';
-import type IndexBuffer from '../gl/index_buffer';
-import type Context from '../gl/context';
-
-class VertexArrayObject {
+import type {Program} from './program';
+import type {VertexBuffer} from '../gl/vertex_buffer';
+import type {IndexBuffer} from '../gl/index_buffer';
+import type {Context} from '../gl/context';
+
+/**
+ * A vertex array object used to pass data to the webgl code
+ */
+export class VertexArrayObject {
     context: Context;
     boundProgram: Program<any>;
     boundLayoutVertexBuffer: VertexBuffer;
@@ -157,5 +160,3 @@ class VertexArrayObject {
         }
     }
 }
-
-export default VertexArrayObject;

package/src/shaders/encode_attribute.ts

@@ -4,8 +4,6 @@ import {clamp} from '../util/util';
  * Packs two numbers, interpreted as 8-bit unsigned integers, into a single
  * float.  Unpack them in the shader using the `unpack_float()` function,
  * defined in _prelude.vertex.glsl
- *
- * @private
  */
 export function packUint8ToFloat(a: number, b: number) {
     // coerce a and b to 8-bit ints

package/src/shaders/shaders.ts

@@ -58,7 +58,7 @@ import terrainCoordsFrag from './terrain_coords.fragment.glsl.g';
 import terrainFrag from './terrain.fragment.glsl.g';
 import terrainVert from './terrain.vertex.glsl.g';
 
-const shaders = {
+export const shaders = {
     prelude: compile(preludeFrag, preludeVert),
     background: compile(backgroundFrag, backgroundVert),
     backgroundPattern: compile(backgroundPatternFrag, backgroundPatternVert),
@@ -90,8 +90,6 @@ const shaders = {
     terrainCoords: compile(terrainCoordsFrag, terrainVert)
 };
 
-export default shaders;
-
 // Expand #pragmas to #ifdefs.
 
 function compile(fragmentSource, vertexSource) {

package/src/source/canvas_source.test.ts

@@ -1,13 +1,13 @@
-import CanvasSource from '../source/canvas_source';
-import Transform from '../geo/transform';
+import {CanvasSource} from '../source/canvas_source';
+import {Transform} from '../geo/transform';
 import {Event, Evented} from '../util/evented';
 import {extend} from '../util/util';
 
-import type Dispatcher from '../util/dispatcher';
-import Tile from './tile';
+import type {Dispatcher} from '../util/dispatcher';
+import {Tile} from './tile';
 import {OverscaledTileID} from './tile_id';
-import VertexBuffer from '../gl/vertex_buffer';
-import SegmentVector from '../data/segment';
+import {VertexBuffer} from '../gl/vertex_buffer';
+import {SegmentVector} from '../data/segment';
 
 function createSource(options?) {
     const c = options && options.canvas || window.document.createElement('canvas');

package/src/source/canvas_source.ts

@@ -1,36 +1,45 @@
-import ImageSource from './image_source';
+import {ImageSource} from './image_source';
 
 import rasterBoundsAttributes from '../data/raster_bounds_attributes';
-import SegmentVector from '../data/segment';
-import Texture from '../render/texture';
+import {SegmentVector} from '../data/segment';
+import {Texture} from '../render/texture';
 import {Event, ErrorEvent} from '../util/evented';
 import {ValidationError} from '@maplibre/maplibre-gl-style-spec';
 
-import type Map from '../ui/map';
-import type Dispatcher from '../util/dispatcher';
+import type {Map} from '../ui/map';
+import type {Dispatcher} from '../util/dispatcher';
 import type {Evented} from '../util/evented';
 
-export type CanvasSourceSpecification = {
-    'type': 'canvas';
-    'coordinates': [[number, number], [number, number], [number, number], [number, number]];
-    'animate'?: boolean;
-    'canvas': string | HTMLCanvasElement;
-};
-
 /**
  * Options to add a canvas source type to the map.
- *
- * @typedef {Object} CanvasSourceOptions
- * @property {string} type Source type. Must be `"canvas"`.
- * @property {string|HTMLCanvasElement} canvas Canvas source from which to read pixels. Can be a string representing the ID of the canvas element, or the `HTMLCanvasElement` itself.
- * @property {Array<Array<number>>} coordinates Four geographical coordinates denoting where to place the corners of the canvas, specified in `[longitude, latitude]` pairs.
- * @property {boolean} [animate=true] Whether the canvas source is animated. If the canvas is static (i.e. pixels do not need to be re-read on every frame), `animate` should be set to `false` to improve performance.
  */
+export type CanvasSourceSpecification = {
+    /**
+     * Source type. Must be `"canvas"`.
+     */
+    type: 'canvas';
+    /**
+     * Four geographical coordinates denoting where to place the corners of the canvas, specified in `[longitude, latitude]` pairs.
+     */
+    coordinates: [[number, number], [number, number], [number, number], [number, number]];
+    /**
+     * Whether the canvas source is animated. If the canvas is static (i.e. pixels do not need to be re-read on every frame), `animate` should be set to `false` to improve performance.
+     * @defaultValue true
+     */
+    animate?: boolean;
+    /**
+     * Canvas source from which to read pixels. Can be a string representing the ID of the canvas element, or the `HTMLCanvasElement` itself.
+     */
+    canvas?: string | HTMLCanvasElement;
+};
 
 /**
- * A data source containing the contents of an HTML canvas. See {@link CanvasSourceOptions} for detailed documentation of options.
+ * A data source containing the contents of an HTML canvas. See {@link CanvasSourceSpecification} for detailed documentation of options.
+ *
+ * @group Sources
  *
  * @example
+ * ```ts
  * // add to map
  * map.addSource('some id', {
  *    type: 'canvas',
@@ -45,7 +54,7 @@ export type CanvasSourceSpecification = {
  * });
  *
  * // update
- * var mySource = map.getSource('some id');
+ * let mySource = map.getSource('some id');
  * mySource.setCoordinates([
  *     [-76.54335737228394, 39.18579907229748],
  *     [-76.52803659439087, 39.1838364847587],
@@ -54,19 +63,26 @@ export type CanvasSourceSpecification = {
  * ]);
  *
  * map.removeSource('some id');  // remove
+ * ```
  */
-class CanvasSource extends ImageSource {
+export class CanvasSource extends ImageSource {
     options: CanvasSourceSpecification;
     animate: boolean;
     canvas: HTMLCanvasElement;
     width: number;
     height: number;
+    /**
+     * Enables animation. The image will be copied from the canvas to the map on each frame.
+     */
     play: () => void;
+    /**
+     * Disables animation. The map will display a static copy of the canvas image.
+     */
     pause: () => void;
     _playing: boolean;
 
     /**
-     * @private
+     * @hidden
      */
     constructor(id: string, options: CanvasSourceSpecification, dispatcher: Dispatcher, eventedParent: Evented) {
         super(id, options, dispatcher, eventedParent);
@@ -93,21 +109,7 @@ class CanvasSource extends ImageSource {
         this.animate = options.animate !== undefined ? options.animate : true;
     }
 
-    /**
-     * Enables animation. The image will be copied from the canvas to the map on each frame.
-     * @method play
-     * @instance
-     * @memberof CanvasSource
-     */
-
-    /**
-     * Disables animation. The map will display a static copy of the canvas image.
-     * @method pause
-     * @instance
-     * @memberof CanvasSource
-     */
-
-    load() {
+    load = () => {
         this._loaded = true;
         if (!this.canvas) {
             this.canvas = (this.options.canvas instanceof HTMLCanvasElement) ?
@@ -137,14 +139,14 @@ class CanvasSource extends ImageSource {
         };
 
         this._finishLoading();
-    }
+    };
 
     /**
      * Returns the HTML `canvas` element.
      *
-     * @returns {HTMLCanvasElement} The HTML `canvas` element.
+     * @returns The HTML `canvas` element.
      */
-    getCanvas() {
+    getCanvas(): HTMLCanvasElement {
         return this.canvas;
     }
 
@@ -160,21 +162,7 @@ class CanvasSource extends ImageSource {
         this.pause();
     }
 
-    // /**
-    // * Sets the canvas's coordinates and re-renders the map.
-    // *
-    // * @method setCoordinates
-    // * @instance
-    // * @memberof CanvasSource
-    // * @param {Array<Array<number>>} coordinates Four geographical coordinates,
-    // *   represented as arrays of longitude and latitude numbers, which define the corners of the canvas.
-    // *   The coordinates start at the top left corner of the canvas and proceed in clockwise order.
-    // *   They do not have to represent a rectangle.
-    // * @returns {CanvasSource} this
-    // */
-    // setCoordinates inherited from ImageSource
-
-    prepare() {
+    prepare = () => {
         let resize = false;
         if (this.canvas.width !== this.width) {
             this.width = this.canvas.width;
@@ -219,14 +207,14 @@ class CanvasSource extends ImageSource {
         if (newTilesLoaded) {
             this.fire(new Event('data', {dataType: 'source', sourceDataType: 'idle', sourceId: this.id}));
         }
-    }
+    };
 
-    serialize(): any {
+    serialize = (): CanvasSourceSpecification => {
         return {
             type: 'canvas',
             coordinates: this.coordinates
         };
-    }
+    };
 
     hasTransition() {
         return this._playing;
@@ -239,5 +227,3 @@ class CanvasSource extends ImageSource {
         return false;
     }
 }
-
-export default CanvasSource;

package/src/source/geojson_source.test.ts

@@ -1,10 +1,10 @@
-import Tile from './tile';
+import {Tile} from './tile';
 import {OverscaledTileID} from './tile_id';
-import GeoJSONSource, {GeoJSONSourceOptions} from './geojson_source';
-import Transform from '../geo/transform';
-import LngLat from '../geo/lng_lat';
+import {GeoJSONSource, GeoJSONSourceOptions} from './geojson_source';
+import {Transform} from '../geo/transform';
+import {LngLat} from '../geo/lng_lat';
 import {extend} from '../util/util';
-import Dispatcher from '../util/dispatcher';
+import {Dispatcher} from '../util/dispatcher';
 import {RequestManager} from '../util/request_manager';
 
 const wrapDispatcher = (dispatcher) => {