3D terrain: rebase to #8694 optimization

debug/terrain-debug.html

@@ -61,7 +61,7 @@
 
 var map = window.map = new mapboxgl.Map({
     container: 'map',
-    style: style,// 'mapbox://styles/mapbox/cjaudgl840gn32rnrepcb9b9g', // the outdoors-v10 style but without Hillshade layers
+    style,
     center: [-119.5591, 37.715],
     zoom: 9,
     hash: true

src/geo/transform.js

@@ -251,7 +251,7 @@ class Transform {
     ): Array<OverscaledTileID> {
         let z = this.coveringZoomLevel(options);
         const actualZ = z;
-        const minZoom = options.minzoom !== undefined ? options.minzoom : 0; 
+        const minZoom = options.minzoom !== undefined ? options.minzoom : 0;
 
         if (z < minZoom) return [];
         if (options.maxzoom !== undefined && z > options.maxzoom) z = options.maxzoom;

src/render/create_grid.js

@@ -20,7 +20,7 @@ import EXTENT from '../data/extent';
  * @param {number} count Count of rows and columns
  * @private
  */
-export default function createGrid(count: Number): [RasterBoundsArray, TriangleIndexArray] {
+export default function createGrid(count: number): [RasterBoundsArray, TriangleIndexArray] {
     const boundsArray = new RasterBoundsArray();
     const indexArray = new TriangleIndexArray();
     boundsArray.reserve(count * count);

src/render/draw_hillshade.js

@@ -1,6 +1,5 @@
 // @flow
 
-import assert from 'assert';
 import Texture from './texture';
 import StencilMode from '../gl/stencil_mode';
 import DepthMode from '../gl/depth_mode';
@@ -66,18 +65,18 @@ function prepareDEMTextures(painter: Painter, sourceCache: SourceCache, layer: H
 
     for (const tileID of tileIDs) {
         const tile = sourceCache.getTile(tileID);
-        if (painter.renderPass === 'offscreen' && !tile.demTexture) {
+        const dem = tile.dem;
+        if (painter.renderPass === 'offscreen' && !tile.demTexture && dem) {
             // No need for using tile.needsHillshadePrepare - _backfillDEM or no upload only once.
-            prepareTexture(painter, tile);
+            prepareTexture(painter, tile, dem);
         }
     }
 }
 
 // Return true means that tile.demTexture contains DEM data and that it is bound
 // to texture unit 1.
-function prepareTexture(painter, tile) {
-    const dem = tile.dem;
-    if (!dem || !dem.data) return false;
+function prepareTexture(painter, tile, dem) {
+    if (!dem.data) return false;
 
     const context = painter.context;
     const gl = context.gl;
@@ -102,10 +101,13 @@ function prepareTexture(painter, tile) {
 // hillshade rendering is done in two steps. the prepare step first calculates the slope of the terrain in the x and y
 // directions for each pixel, and saves those values to a framebuffer texture in the r and g channels.
 function prepareHillshade(painter, tile, layer, sourceMaxZoom, depthMode, stencilMode, colorMode) {
-    if (prepareTexture(painter, tile)) {
+    const dem = tile.dem;
+    if (!dem) return false;
+
+    if (prepareTexture(painter, tile, dem)) {
         const context = painter.context;
         const gl = context.gl;
-        const tileSize = tile.dem.dim;
+        const tileSize = dem.dim;
 
         context.activeTexture.set(gl.TEXTURE0);
         let fbo = tile.fbo;
@@ -131,4 +133,4 @@ function prepareHillshade(painter, tile, layer, sourceMaxZoom, depthMode, stenci
     }
 }
 
-export { drawHillshade, prepareDEMTextures };
+export { drawHillshade, prepareDEMTextures };

src/render/draw_raster.js

@@ -8,6 +8,8 @@ import StencilMode from '../gl/stencil_mode';
 import DepthMode from '../gl/depth_mode';
 import CullFaceMode from '../gl/cull_face_mode';
 import { rasterUniformValues } from './program/raster_program';
+import Texture from './texture';
+import assert from 'assert';
 
 import type Painter from './painter';
 import type SourceCache from '../source/source_cache';
@@ -69,18 +71,20 @@ function drawRaster(painter: Painter, sourceCache: SourceCache, layer: RasterSty
             tile.texture.bind(textureFilter, gl.CLAMP_TO_EDGE, gl.LINEAR_MIPMAP_NEAREST);
         }
 
-        let heightMap = painter.zeroTexture;
+        context.activeTexture.set(gl.TEXTURE2);
+        let demUnpack = [0, 0, 0, 0];
+        let demTexture = painter.zeroTexture;
+        // If no elevation data, zero dem_unpack in vertex shader is setting sampled elevation to zero.
         if (elevation) {
             const demTile = elevation.getTile(coord);
-            // TODO: explain why this makes sense here - only cover tiles are
-            // retained in SourceCache update. See usage of isRasterType there. 
-            if (!(demTile && demTile.demTexture)) continue;
-            heightMap = demTile.demTexture;
+            if (!demTile || !demTile.demTexture) continue;
+            assert(demTile.dem);
+            demTexture = ((demTile.demTexture: any): Texture);
+            demUnpack = demTile.dem.getUnpackVector();
         }
-        context.activeTexture.set(gl.TEXTURE2);
-        heightMap.bind(gl.NEAREST, gl.CLAMP_TO_EDGE, gl.LINEAR_MIPMAP_NEAREST);
-
-        const uniformValues = rasterUniformValues(posMatrix, parentTL || [0, 0], parentScaleBy || 1, fade, layer);
+        demTexture.bind(gl.NEAREST, gl.CLAMP_TO_EDGE, gl.LINEAR_MIPMAP_NEAREST);
+
+        const uniformValues = rasterUniformValues(posMatrix, parentTL || [0, 0], parentScaleBy || 1, fade, layer, demUnpack);
 
         if (source instanceof ImageSource) {
             program.draw(context, gl.TRIANGLES, depthMode, stencilMode, colorMode, CullFaceMode.disabled,

src/render/painter.js

@@ -35,7 +35,7 @@ import raster from './draw_raster';
 import background from './draw_background';
 import debug from './draw_debug';
 import custom from './draw_custom';
-import createGrid from './create_grid'
+import createGrid from './create_grid';
 import { RGBAImage } from '../util/image';
 
 const draw = {

src/render/program/raster_program.js

@@ -5,7 +5,8 @@ import {
     Uniform1f,
     Uniform2f,
     Uniform3f,
-    UniformMatrix4f
+    UniformMatrix4f,
+    Uniform4f
 } from '../uniform_binding';
 
 import type Context from '../../gl/context';
@@ -21,7 +22,8 @@ export type RasterUniformsType = {|
     'u_opacity': Uniform1f,
     'u_image0': Uniform1i,
     'u_image1': Uniform1i,
-    'u_image2': Uniform1i,
+    'u_dem': Uniform1i,
+    'u_dem_unpack': Uniform4f,
     'u_brightness_low': Uniform1f,
     'u_brightness_high': Uniform1f,
     'u_saturation_factor': Uniform1f,
@@ -38,7 +40,8 @@ const rasterUniforms = (context: Context, locations: UniformLocations): RasterUn
     'u_opacity': new Uniform1f(context, locations.u_opacity),
     'u_image0': new Uniform1i(context, locations.u_image0),
     'u_image1': new Uniform1i(context, locations.u_image1),
-    'u_image2': new Uniform1i(context, locations.u_image2),
+    'u_dem': new Uniform1i(context, locations.u_dem),
+    'u_dem_unpack': new Uniform4f(context, locations.u_dem_unpack),
     'u_brightness_low': new Uniform1f(context, locations.u_brightness_low),
     'u_brightness_high': new Uniform1f(context, locations.u_brightness_high),
     'u_saturation_factor': new Uniform1f(context, locations.u_saturation_factor),
@@ -51,7 +54,8 @@ const rasterUniformValues = (
     parentTL: [number, number],
     parentScaleBy: number,
     fade: {mix: number, opacity: number},
-    layer: RasterStyleLayer
+    layer: RasterStyleLayer,
+    elevationUnpack: [number, number, number, number]
 ): UniformValues<RasterUniformsType> => ({
     'u_matrix': matrix,
     'u_tl_parent': parentTL,
@@ -61,7 +65,8 @@ const rasterUniformValues = (
     'u_opacity': fade.opacity * layer.paint.get('raster-opacity'),
     'u_image0': 0,
     'u_image1': 1,
-    'u_image2': 2,
+    'u_dem': 2,
+    'u_dem_unpack': elevationUnpack,
     'u_brightness_low': layer.paint.get('raster-brightness-min'),
     'u_brightness_high': layer.paint.get('raster-brightness-max'),
     'u_saturation_factor': saturationFactor(layer.paint.get('raster-saturation')),

src/shaders/raster.vertex.glsl

@@ -2,7 +2,8 @@ uniform mat4 u_matrix;
 uniform vec2 u_tl_parent;
 uniform float u_scale_parent;
 uniform float u_buffer_scale;
-uniform sampler2D u_image2;
+uniform sampler2D u_dem;
+uniform vec4 u_dem_unpack;
 
 attribute vec2 a_pos;
 attribute vec2 a_texture_pos;
@@ -19,9 +20,9 @@ void main() {
     v_pos0 = (((a_texture_pos / 8192.0) - 0.5) / u_buffer_scale ) + 0.5;
     v_pos1 = (v_pos0 * u_scale_parent) + u_tl_parent;
 
-    vec4 dem = texture2D(u_image2, v_pos0);
-    // TODO: 1x1 zero elevation texture (r = 0, g = 0, b = 1) to avoid length == 0 check.
-    float elevation = dot(dem, dem) == 0.0 ?
-        0.0 : (dot(dem, vec4(255.0, 255.0 * 256.0, 255.0 * 256.0 *256.0, 0.0)) - 65536.0) * 2.5; // Exaggerate, a bit.
+    vec4 dem = texture2D(u_dem, v_pos0) * 255.0;
+    // Convert encoded elevation value to meters
+    dem.a = -1.0;
+    float elevation = dot(dem, u_dem_unpack) * 2.5; // Exaggerate, a bit.
     gl_Position = u_matrix * vec4(a_pos, elevation, 1);
 }

src/style/style_layer.js

@@ -100,8 +100,6 @@ class StyleLayer extends Evented {
             }
 
             this._transitioningPaint = this._transitionablePaint.untransitioned();
-        } else {
-            this._transitioningPaint = new Transitioning({defaultTransitioningPropertyValues: null, defaultPossiblyEvaluatedValues: null});
         }
     }
 

src/style/style_layer/elevation_style_layer.js

@@ -13,6 +13,10 @@ class ElevationStyleLayer extends StyleLayer {
     hasOffscreenPass() {
         return true;
     }
+
+    recalculate() {}
+    updateTransitions() {}
+    hasTransition() {}
 }
 
 export default ElevationStyleLayer;