@mapgis/mapbox-gl 16.0.0 → 16.2.0

package/src/index.js

@@ -1,201 +0,0 @@
-// @flow
-
-import assert from 'assert';
-import supported from '@mapbox/mapbox-gl-supported';
-
-import {version} from '../package.json';
-import Map from './ui/map';
-import OfflineMap from './ui/offline_map';
-import NavigationControl from './ui/control/navigation_control';
-import GeolocateControl from './ui/control/geolocate_control';
-import AttributionControl from './ui/control/attribution_control';
-import ScaleControl from './ui/control/scale_control';
-import FpsControl from './ui/control/fps_control';
-import FullscreenControl from './ui/control/fullscreen_control';
-import Popup from './ui/popup';
-import Marker from './ui/marker';
-import Style from './style/style';
-import LngLat from './geo/lng_lat';
-import LngLatBounds from './geo/lng_lat_bounds';
-import Point from '@mapbox/point-geometry';
-
-import MercatorCoordinate from './geo/mercator_coordinate';
-import CRS from './ui/crs';
-import {CanonicalTileID} from './source/tile_id';
-
-import {Evented} from './util/evented';
-import config from './util/config';
-import {Debug} from './util/debug';
-import {isSafari} from './util/util';
-import {setRTLTextPlugin, getRTLTextPluginStatus} from './source/rtl_text_plugin';
-import WorkerPool from './util/worker_pool';
-import {clearTileCache} from './util/tile_request_cache';
-import {PerformanceUtils} from './util/performance';
-
-const exported = {
-    version,
-    supported,
-    setRTLTextPlugin,
-    getRTLTextPluginStatus,
-    Map,
-    OfflineMap,
-    NavigationControl,
-    GeolocateControl,
-    AttributionControl,
-    ScaleControl,
-    FullscreenControl,
-    FpsControl,
-    Popup,
-    Marker,
-    Style,
-    LngLat,
-    LngLatBounds,
-    Point,
-    MercatorCoordinate,
-    CRS,
-    CanonicalTileID,
-    Evented,
-    config,
-
-    /**
-     * Gets and sets the map's [access token](https://www.mapbox.com/help/define-access-token/).
-     *
-     * @var {string} accessToken
-     * @returns {string} The currently set access token.
-     * @example
-     * mapboxgl.accessToken = myAccessToken;
-     * @see [Display a map](https://www.mapbox.com/mapbox-gl-js/examples/)
-     */
-    get accessToken(): ?string {
-        return config.ACCESS_TOKEN;
-    },
-
-    set accessToken(token: string) {
-        config.ACCESS_TOKEN = token;
-    },
-
-    /**
-     * Gets and sets the map's default API URL for requesting tiles, styles, sprites, and glyphs
-     *
-     * @var {string} baseApiUrl
-     * @returns {string} The current base API URL.
-     * @example
-     * mapboxgl.baseApiUrl = 'https://api.mapbox.com';
-     */
-    get baseApiUrl(): ?string {
-        return config.API_URL;
-    },
-
-    set baseApiUrl(url: string) {
-        config.API_URL = url;
-    },
-
-    /**
-     * Gets and sets the number of web workers instantiated on a page with GL JS maps.
-     * By default, it is set to half the number of CPU cores (capped at 6).
-     * Make sure to set this property before creating any map instances for it to have effect.
-     *
-     * @var {string} workerCount
-     * @returns {number} Number of workers currently configured.
-     * @example
-     * mapboxgl.workerCount = 2;
-     */
-    get workerCount(): number {
-        return WorkerPool.workerCount;
-    },
-
-    set workerCount(count: number) {
-        WorkerPool.workerCount = count;
-    },
-
-    /**
-     * Gets and sets the maximum number of images (raster tiles, sprites, icons) to load in parallel,
-     * which affects performance in raster-heavy maps. 16 by default.
-     *
-     * @var {string} maxParallelImageRequests
-     * @returns {number} Number of parallel requests currently configured.
-     * @example
-     * mapboxgl.maxParallelImageRequests = 10;
-     */
-    get maxParallelImageRequests(): number {
-        return config.MAX_PARALLEL_IMAGE_REQUESTS;
-    },
-
-    set maxParallelImageRequests(numRequests: number) {
-        config.MAX_PARALLEL_IMAGE_REQUESTS = numRequests;
-    },
-
-    /**
-     * Clears browser storage used by this library. Using this method flushes the Mapbox tile
-     * cache that is managed by this library. Tiles may still be cached by the browser
-     * in some cases.
-     *
-     * This API is supported on browsers where the [`Cache` API](https://developer.mozilla.org/en-US/docs/Web/API/Cache)
-     * is supported and enabled. This includes all major browsers when pages are served over
-     * `https://`, except Internet Explorer and Edge Mobile.
-     *
-     * When called in unsupported browsers or environments (private or incognito mode), the
-     * callback will be called with an error argument.
-     *
-     * @function clearStorage
-     * @param {Function} callback Called with an error argument if there is an error.
-     */
-    clearStorage(callback?: (err: ?Error) => void) {
-        clearTileCache(callback);
-    },
-
-    workerUrl: ''
-};
-
-//This gets automatically stripped out in production builds.
-Debug.extend(exported, {isSafari, getPerformanceMetrics: PerformanceUtils.getPerformanceMetrics});
-
-/**
- * The version of Mapbox GL JS in use as specified in `package.json`,
- * `CHANGELOG.md`, and the GitHub release.
- *
- * @var {string} version
- */
-
-/**
- * Test whether the browser [supports Mapbox GL JS](https://www.mapbox.com/help/mapbox-browser-support/#mapbox-gl-js).
- *
- * @function supported
- * @param {Object} [options]
- * @param {boolean} [options.failIfMajorPerformanceCaveat=false] If `true`,
- *   the function will return `false` if the performance of Mapbox GL JS would
- *   be dramatically worse than expected (e.g. a software WebGL renderer would be used).
- * @return {boolean}
- * @example
- * mapboxgl.supported() // = true
- * @see [Check for browser support](https://www.mapbox.com/mapbox-gl-js/example/check-for-support/)
- */
-
-/**
- * Sets the map's [RTL text plugin](https://www.mapbox.com/mapbox-gl-js/plugins/#mapbox-gl-rtl-text).
- * Necessary for supporting the Arabic and Hebrew languages, which are written right-to-left. Mapbox Studio loads this plugin by default.
- *
- * @function setRTLTextPlugin
- * @param {string} pluginURL URL pointing to the Mapbox RTL text plugin source.
- * @param {Function} callback Called with an error argument if there is an error.
- * @param {boolean} lazy If set to `true`, mapboxgl will defer loading the plugin until rtl text is encountered,
- *    rtl text will then be rendered only after the plugin finishes loading.
- * @example
- * mapboxgl.setRTLTextPlugin('https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.0/mapbox-gl-rtl-text.js');
- * @see [Add support for right-to-left scripts](https://www.mapbox.com/mapbox-gl-js/example/mapbox-gl-rtl-text/)
- */
-
-/**
-  * Gets the map's [RTL text plugin](https://www.mapbox.com/mapbox-gl-js/plugins/#mapbox-gl-rtl-text) status.
-  * The status can be `unavailable` (i.e. not requested or removed), `loading`, `loaded` or `error`.
-  * If the status is `loaded` and the plugin is requested again, an error will be thrown.
-  *
-  * @function getRTLTextPluginStatus
-  * @example
-  * const pluginStatus = mapboxgl.getRTLTextPluginStatus();
-  */
-
-export default exported;
-
-// canary assert: used to confirm that asserts have been removed from production build
-assert(true, 'canary assert');

package/src/render/draw_background.js

@@ -1,57 +0,0 @@
-// @flow
-
-import StencilMode from '../gl/stencil_mode';
-import DepthMode from '../gl/depth_mode';
-import CullFaceMode from '../gl/cull_face_mode';
-import {
-    backgroundUniformValues,
-    backgroundPatternUniformValues
-} from './program/background_program';
-
-import type Painter from './painter';
-import type SourceCache from '../source/source_cache';
-import type BackgroundStyleLayer from '../style/style_layer/background_style_layer';
-
-export default drawBackground;
-
-function drawBackground(painter: Painter, sourceCache: SourceCache, layer: BackgroundStyleLayer) {
-    const color = layer.paint.get('background-color');
-    const opacity = layer.paint.get('background-opacity');
-
-    if (opacity === 0) return;
-
-    const context = painter.context;
-    const gl = context.gl;
-    const transform = painter.transform;
-    const tileSize = transform.tileSize;
-    const image = layer.paint.get('background-pattern');
-    if (painter.isPatternMissing(image)) return;
-
-    const pass = (!image && color.a === 1 && opacity === 1 && painter.opaquePassEnabledForLayer()) ? 'opaque' : 'translucent';
-    if (painter.renderPass !== pass) return;
-
-    const stencilMode = StencilMode.disabled;
-    const depthMode = painter.depthModeForSublayer(0, pass === 'opaque' ? DepthMode.ReadWrite : DepthMode.ReadOnly);
-    const colorMode = painter.colorModeForRenderPass();
-
-    const program = painter.useProgram(image ? 'backgroundPattern' : 'background');
-
-    const tileIDs = transform.coveringTiles({tileSize});
-
-    if (image) {
-        context.activeTexture.set(gl.TEXTURE0);
-        painter.imageManager.bind(painter.context);
-    }
-
-    const crossfade = layer.getCrossfadeParameters();
-    for (const tileID of tileIDs) {
-        const matrix = painter.transform.calculatePosMatrix(tileID.toUnwrapped());
-        const uniformValues = image ?
-            backgroundPatternUniformValues(matrix, opacity, painter, image, {tileID, tileSize}, crossfade) :
-            backgroundUniformValues(matrix, opacity, color);
-
-        program.draw(context, gl.TRIANGLES, depthMode, stencilMode, colorMode, CullFaceMode.disabled,
-            uniformValues, layer.id, painter.tileExtentBuffer,
-            painter.quadTriangleIndexBuffer, painter.tileExtentSegments);
-    }
-}

package/src/render/draw_circle.js

@@ -1,113 +0,0 @@
-// @flow
-
-import StencilMode from '../gl/stencil_mode';
-import DepthMode from '../gl/depth_mode';
-import CullFaceMode from '../gl/cull_face_mode';
-import Program from './program';
-import {circleUniformValues} from './program/circle_program';
-import SegmentVector from '../data/segment';
-import {OverscaledTileID} from '../source/tile_id';
-
-import type Painter from './painter';
-import type SourceCache from '../source/source_cache';
-import type CircleStyleLayer from '../style/style_layer/circle_style_layer';
-import type CircleBucket from '../data/bucket/circle_bucket';
-import type ProgramConfiguration from '../data/program_configuration';
-import type VertexBuffer from '../gl/vertex_buffer';
-import type IndexBuffer from '../gl/index_buffer';
-import type {UniformValues} from './uniform_binding';
-import type {CircleUniformsType} from './program/circle_program';
-
-export default drawCircles;
-
-type TileRenderState = {
-    programConfiguration: ProgramConfiguration,
-    program: Program<*>,
-    layoutVertexBuffer: VertexBuffer,
-    indexBuffer: IndexBuffer,
-    uniformValues: UniformValues<CircleUniformsType>
-};
-
-type SegmentsTileRenderState = {
-    segments: SegmentVector,
-    sortKey: number,
-    state: TileRenderState
-};
-
-function drawCircles(painter: Painter, sourceCache: SourceCache, layer: CircleStyleLayer, coords: Array<OverscaledTileID>) {
-    if (painter.renderPass !== 'translucent') return;
-
-    const opacity = layer.paint.get('circle-opacity');
-    const strokeWidth = layer.paint.get('circle-stroke-width');
-    const strokeOpacity = layer.paint.get('circle-stroke-opacity');
-    const sortFeaturesByKey = layer.layout.get('circle-sort-key').constantOr(1) !== undefined;
-
-    if (opacity.constantOr(1) === 0 && (strokeWidth.constantOr(1) === 0 || strokeOpacity.constantOr(1) === 0)) {
-        return;
-    }
-
-    const context = painter.context;
-    const gl = context.gl;
-
-    const depthMode = painter.depthModeForSublayer(0, DepthMode.ReadOnly);
-    // Turn off stencil testing to allow circles to be drawn across boundaries,
-    // so that large circles are not clipped to tiles
-    const stencilMode = StencilMode.disabled;
-    const colorMode = painter.colorModeForRenderPass();
-
-    const segmentsRenderStates: Array<SegmentsTileRenderState> = [];
-
-    for (let i = 0; i < coords.length; i++) {
-        const coord = coords[i];
-
-        const tile = sourceCache.getTile(coord);
-        const bucket: ?CircleBucket<*> = (tile.getBucket(layer): any);
-        if (!bucket) continue;
-
-        const programConfiguration = bucket.programConfigurations.get(layer.id);
-        const program = painter.useProgram('circle', programConfiguration);
-        const layoutVertexBuffer = bucket.layoutVertexBuffer;
-        const indexBuffer = bucket.indexBuffer;
-        const uniformValues = circleUniformValues(painter, coord, tile, layer);
-
-        const state: TileRenderState = {
-            programConfiguration,
-            program,
-            layoutVertexBuffer,
-            indexBuffer,
-            uniformValues,
-        };
-
-        if (sortFeaturesByKey) {
-            const oldSegments = bucket.segments.get();
-            for (const segment of oldSegments) {
-                segmentsRenderStates.push({
-                    segments: new SegmentVector([segment]),
-                    sortKey: ((segment.sortKey: any): number),
-                    state
-                });
-            }
-        } else {
-            segmentsRenderStates.push({
-                segments: bucket.segments,
-                sortKey: 0,
-                state
-            });
-        }
-
-    }
-
-    if (sortFeaturesByKey) {
-        segmentsRenderStates.sort((a, b) => a.sortKey - b.sortKey);
-    }
-
-    for (const segmentsState of segmentsRenderStates) {
-        const {programConfiguration, program, layoutVertexBuffer, indexBuffer, uniformValues} = segmentsState.state;
-        const segments = segmentsState.segments;
-
-        program.draw(context, gl.TRIANGLES, depthMode, stencilMode, colorMode, CullFaceMode.disabled,
-            uniformValues, layer.id,
-            layoutVertexBuffer, indexBuffer, segments,
-            layer.paint, painter.transform.zoom, programConfiguration);
-    }
-}

package/src/render/draw_collision_debug.js

@@ -1,49 +0,0 @@
-// @flow
-
-import type Painter from './painter';
-import type SourceCache from '../source/source_cache';
-import type StyleLayer from '../style/style_layer';
-import type {OverscaledTileID} from '../source/tile_id';
-import type SymbolBucket from '../data/bucket/symbol_bucket';
-import DepthMode from '../gl/depth_mode';
-import StencilMode from '../gl/stencil_mode';
-import CullFaceMode from '../gl/cull_face_mode';
-import {collisionUniformValues} from './program/collision_program';
-
-export default drawCollisionDebug;
-
-function drawCollisionDebugGeometry(painter: Painter, sourceCache: SourceCache, layer: StyleLayer, coords: Array<OverscaledTileID>, drawCircles: boolean,
-    translate: [number, number], translateAnchor: 'map' | 'viewport', isText: boolean) {
-    const context = painter.context;
-    const gl = context.gl;
-    const program = drawCircles ? painter.useProgram('collisionCircle') : painter.useProgram('collisionBox');
-
-    for (let i = 0; i < coords.length; i++) {
-        const coord = coords[i];
-        const tile = sourceCache.getTile(coord);
-        const bucket: ?SymbolBucket = (tile.getBucket(layer): any);
-        if (!bucket) continue;
-        const buffers = drawCircles ? (isText ? bucket.textCollisionCircle : bucket.iconCollisionCircle) : (isText ? bucket.textCollisionBox : bucket.iconCollisionBox);
-        if (!buffers) continue;
-        let posMatrix = coord.posMatrix;
-        if (translate[0] !== 0 || translate[1] !== 0) {
-            posMatrix = painter.translatePosMatrix(coord.posMatrix, tile, translate, translateAnchor);
-        }
-        program.draw(context, drawCircles ? gl.TRIANGLES : gl.LINES,
-            DepthMode.disabled, StencilMode.disabled,
-            painter.colorModeForRenderPass(),
-            CullFaceMode.disabled,
-            collisionUniformValues(
-                posMatrix,
-                painter.transform,
-                tile),
-            layer.id, buffers.layoutVertexBuffer, buffers.indexBuffer,
-            buffers.segments, null, painter.transform.zoom, null, null,
-            buffers.collisionVertexBuffer);
-    }
-}
-
-function drawCollisionDebug(painter: Painter, sourceCache: SourceCache, layer: StyleLayer, coords: Array<OverscaledTileID>, translate: [number, number], translateAnchor: 'map' | 'viewport', isText: boolean) {
-    drawCollisionDebugGeometry(painter, sourceCache, layer, coords, false, translate, translateAnchor, isText);
-    drawCollisionDebugGeometry(painter, sourceCache, layer, coords, true, translate, translateAnchor, isText);
-}

package/src/render/draw_custom.js

@@ -1,49 +0,0 @@
-// @flow
-
-export default drawCustom;
-
-import DepthMode from '../gl/depth_mode';
-import StencilMode from '../gl/stencil_mode';
-
-import type Painter from './painter';
-import type SourceCache from '../source/source_cache';
-import type CustomStyleLayer from '../style/style_layer/custom_style_layer';
-
-function drawCustom(painter: Painter, sourceCache: SourceCache, layer: CustomStyleLayer) {
-
-    const context = painter.context;
-    const implementation = layer.implementation;
-
-    if (painter.renderPass === 'offscreen') {
-
-        const prerender = implementation.prerender;
-        if (prerender) {
-            painter.setCustomLayerDefaults();
-            context.setColorMode(painter.colorModeForRenderPass());
-
-            prerender.call(implementation, context.gl, painter.transform.customLayerMatrix());
-
-            context.setDirty();
-            painter.setBaseState();
-        }
-
-    } else if (painter.renderPass === 'translucent') {
-
-        painter.setCustomLayerDefaults();
-
-        context.setColorMode(painter.colorModeForRenderPass());
-        context.setStencilMode(StencilMode.disabled);
-
-        const depthMode = implementation.renderingMode === '3d' ?
-            new DepthMode(painter.context.gl.LEQUAL, DepthMode.ReadWrite, painter.depthRangeFor3D) :
-            painter.depthModeForSublayer(0, DepthMode.ReadOnly);
-
-        context.setDepthMode(depthMode);
-
-        implementation.render(context.gl, painter.transform.customLayerMatrix());
-
-        context.setDirty();
-        painter.setBaseState();
-        context.bindFramebuffer.set(null);
-    }
-}

package/src/render/draw_debug.js

@@ -1,127 +0,0 @@
-// @flow
-
-import DepthMode from '../gl/depth_mode';
-import StencilMode from '../gl/stencil_mode';
-import CullFaceMode from '../gl/cull_face_mode';
-import {debugUniformValues} from './program/debug_program';
-import Color from '../style-spec/util/color';
-import ColorMode from '../gl/color_mode';
-import browser from '../util/browser';
-
-import type Painter from './painter';
-import type SourceCache from '../source/source_cache';
-import type {OverscaledTileID} from '../source/tile_id';
-
-export default drawDebug;
-
-const topColor = new Color(1, 0, 0, 1);
-const btmColor = new Color(0, 1, 0, 1);
-const leftColor = new Color(0, 0, 1, 1);
-const rightColor = new Color(1, 0, 1, 1);
-const centerColor = new Color(0, 1, 1, 1);
-
-export function drawDebugPadding(painter: Painter) {
-    const padding = painter.transform.padding;
-    const lineWidth = 3;
-    // Top
-    drawHorizontalLine(painter, painter.transform.height - (padding.top || 0), lineWidth, topColor);
-    // Bottom
-    drawHorizontalLine(painter, padding.bottom || 0, lineWidth, btmColor);
-    // Left
-    drawVerticalLine(painter, padding.left || 0, lineWidth, leftColor);
-    // Right
-    drawVerticalLine(painter, painter.transform.width - (padding.right || 0), lineWidth, rightColor);
-    // Center
-    const center = painter.transform.centerPoint;
-    drawCrosshair(painter, center.x, painter.transform.height - center.y, centerColor);
-}
-
-function drawCrosshair(painter: Painter, x: number, y: number, color: Color) {
-    const size = 20;
-    const lineWidth = 2;
-    //Vertical line
-    drawDebugSSRect(painter, x - lineWidth / 2, y - size / 2, lineWidth, size, color);
-    //Horizontal line
-    drawDebugSSRect(painter, x - size / 2, y - lineWidth / 2, size, lineWidth, color);
-}
-
-function drawHorizontalLine(painter: Painter, y: number, lineWidth: number, color: Color) {
-    drawDebugSSRect(painter, 0, y  + lineWidth / 2, painter.transform.width,  lineWidth, color);
-}
-
-function drawVerticalLine(painter: Painter, x: number, lineWidth: number, color: Color) {
-    drawDebugSSRect(painter, x - lineWidth / 2, 0, lineWidth,  painter.transform.height, color);
-}
-
-function drawDebugSSRect(painter: Painter, x: number, y: number, width: number, height: number, color: Color) {
-    const context = painter.context;
-    const gl = context.gl;
-
-    gl.enable(gl.SCISSOR_TEST);
-    gl.scissor(x * browser.devicePixelRatio, y * browser.devicePixelRatio, width * browser.devicePixelRatio, height * browser.devicePixelRatio);
-    context.clear({color});
-    gl.disable(gl.SCISSOR_TEST);
-}
-
-function drawDebug(painter: Painter, sourceCache: SourceCache, coords: Array<OverscaledTileID>) {
-    for (let i = 0; i < coords.length; i++) {
-        drawDebugTile(painter, sourceCache, coords[i]);
-    }
-}
-
-function drawDebugTile(painter, sourceCache, coord: OverscaledTileID) {
-    const context = painter.context;
-    const gl = context.gl;
-
-    const posMatrix = coord.posMatrix;
-    const program = painter.useProgram('debug');
-
-    const depthMode = DepthMode.disabled;
-    const stencilMode = StencilMode.disabled;
-    const colorMode = painter.colorModeForRenderPass();
-    const id = '$debug';
-
-    context.activeTexture.set(gl.TEXTURE0);
-    // Bind the empty texture for drawing outlines
-    painter.emptyTexture.bind(gl.LINEAR, gl.CLAMP_TO_EDGE);
-
-    program.draw(context, gl.LINE_STRIP, depthMode, stencilMode, colorMode, CullFaceMode.disabled,
-        debugUniformValues(posMatrix, Color.red), id,
-        painter.debugBuffer, painter.tileBorderIndexBuffer, painter.debugSegments);
-
-    const tileRawData = sourceCache.getTileByID(coord.key).latestRawTileData;
-    const tileByteLength = (tileRawData && tileRawData.byteLength) || 0;
-    const tileSizeKb = Math.floor(tileByteLength / 1024);
-    const tileSize = sourceCache.getTile(coord).tileSize;
-    const scaleRatio = (512 / Math.min(tileSize, 512) * (coord.overscaledZ / painter.transform.zoom)) * 0.5;
-    let tileIdText = coord.canonical.toString();
-    if (coord.overscaledZ !== coord.canonical.z) {
-        tileIdText += ` => ${coord.overscaledZ}`;
-    }
-    const tileLabel = `${tileIdText} ${tileSizeKb}kb`;
-    drawTextToOverlay(painter, tileLabel);
-
-    program.draw(context, gl.TRIANGLES, depthMode, stencilMode, ColorMode.alphaBlended, CullFaceMode.disabled,
-        debugUniformValues(posMatrix, Color.transparent, scaleRatio), id,
-        painter.debugBuffer, painter.quadTriangleIndexBuffer, painter.debugSegments);
-}
-
-function drawTextToOverlay(painter: Painter, text: string) {
-    painter.initDebugOverlayCanvas();
-    const canvas = painter.debugOverlayCanvas;
-    const gl = painter.context.gl;
-    const ctx2d = painter.debugOverlayCanvas.getContext('2d');
-    ctx2d.clearRect(0, 0, canvas.width, canvas.height);
-
-    ctx2d.shadowColor = 'white';
-    ctx2d.shadowBlur = 2;
-    ctx2d.lineWidth = 1.5;
-    ctx2d.strokeStyle = 'white';
-    ctx2d.textBaseline = 'top';
-    ctx2d.font = `bold ${36}px Open Sans, sans-serif`;
-    ctx2d.fillText(text, 5, 5);
-    ctx2d.strokeText(text, 5, 5);
-
-    painter.debugOverlayTexture.update(canvas);
-    painter.debugOverlayTexture.bind(gl.LINEAR, gl.CLAMP_TO_EDGE);
-}