@mapwhit/tilerenderer 0.48.0 → 0.50.0

package/src/style-spec/function/convert.js

@@ -2,86 +2,71 @@ const assert = require('assert');
 
 module.exports = convertFunction;
 
-function convertFunction(parameters, propertySpec) {
-  let expression;
+function convertLiteral(value) {
+  return typeof value === 'object' ? ['literal', value] : value;
+}
 
-  parameters = { ...parameters };
-  let defaultExpression;
-  if (typeof parameters.default !== 'undefined') {
-    defaultExpression = convertValue(parameters.default, propertySpec);
-  } else {
-    defaultExpression = convertValue(propertySpec.default, propertySpec);
-    if (defaultExpression === null) {
-      defaultExpression = ['error', 'No default property value available.'];
-    }
+function convertFunction(parameters, propertySpec) {
+  let stops = parameters.stops;
+  if (!stops) {
+    // identity function
+    return convertIdentityFunction(parameters, propertySpec);
   }
 
-  if (parameters.stops) {
-    const zoomAndFeatureDependent = parameters.stops && typeof parameters.stops[0][0] === 'object';
-    const featureDependent = zoomAndFeatureDependent || parameters.property !== undefined;
-    const zoomDependent = zoomAndFeatureDependent || !featureDependent;
-
-    const stops = parameters.stops.map(stop => {
-      if (!featureDependent && propertySpec.tokens && typeof stop[1] === 'string') {
-        return [stop[0], convertTokenString(stop[1])];
-      }
-      return [stop[0], convertValue(stop[1], propertySpec)];
-    });
+  const zoomAndFeatureDependent = stops && typeof stops[0][0] === 'object';
+  const featureDependent = zoomAndFeatureDependent || parameters.property !== undefined;
+  const zoomDependent = zoomAndFeatureDependent || !featureDependent;
 
-    if (parameters.colorSpace && parameters.colorSpace !== 'rgb') {
-      throw new Error('Unimplemented');
+  stops = stops.map(stop => {
+    if (!featureDependent && propertySpec.tokens && typeof stop[1] === 'string') {
+      return [stop[0], convertTokenString(stop[1])];
     }
+    return [stop[0], convertLiteral(stop[1])];
+  });
 
-    if (zoomAndFeatureDependent) {
-      expression = convertZoomAndPropertyFunction(parameters, propertySpec, stops, defaultExpression);
-    } else if (zoomDependent) {
-      expression = convertZoomFunction(parameters, propertySpec, stops);
-    } else {
-      expression = convertPropertyFunction(parameters, propertySpec, stops, defaultExpression);
-    }
-  } else {
-    // identity function
-    expression = convertIdentityFunction(parameters, propertySpec, defaultExpression);
+  if (zoomAndFeatureDependent) {
+    return convertZoomAndPropertyFunction(parameters, propertySpec, stops);
   }
-
-  return expression;
+  if (zoomDependent) {
+    return convertZoomFunction(parameters, propertySpec, stops);
+  }
+  return convertPropertyFunction(parameters, propertySpec, stops);
 }
 
-function convertIdentityFunction(parameters, propertySpec, defaultExpression) {
+function convertIdentityFunction(parameters, propertySpec) {
   const get = ['get', parameters.property];
 
-  if (propertySpec.type === 'color') {
-    return parameters.default === undefined ? get : ['to-color', get, parameters.default];
+  if (parameters.default === undefined) {
+    // By default, expressions for string-valued properties get coerced. To preserve
+    // legacy function semantics, insert an explicit assertion instead.
+    return propertySpec.type === 'string' ? ['string', get] : get;
   }
-  if (propertySpec.type === 'array' && typeof propertySpec.length === 'number') {
-    return ['array', propertySpec.value, propertySpec.length, get];
+  if (propertySpec.type === 'enum') {
+    return ['match', get, Object.keys(propertySpec.values), get, parameters.default];
   }
+  const expression = [
+    propertySpec.type === 'color' ? 'to-color' : propertySpec.type,
+    get,
+    convertLiteral(parameters.default)
+  ];
   if (propertySpec.type === 'array') {
-    return ['array', propertySpec.value, get];
+    expression.splice(1, 0, propertySpec.value, propertySpec.length || null);
   }
-  if (propertySpec.type === 'enum') {
-    return [
-      'let',
-      'property_value',
-      ['string', get],
-      ['match', ['var', 'property_value'], propertySpec.values, ['var', 'property_value'], defaultExpression]
-    ];
-  }
-  return parameters.default === undefined ? get : [propertySpec.type, get, parameters.default];
+  return expression;
 }
 
-function convertValue(value, spec) {
-  if (typeof value === 'undefined' || value === null) return null;
-  if (spec.type === 'color') {
-    return value;
+function getInterpolateOperator(parameters) {
+  switch (parameters.colorSpace) {
+    case 'hcl':
+      return 'interpolate-hcl';
+    case 'lab':
+      return 'interpolate-lab';
+    default:
+      return 'interpolate';
   }
-  if (spec.type === 'array') {
-    return ['literal', value];
-  }
-  return value;
 }
 
-function convertZoomAndPropertyFunction(parameters, propertySpec, stops, defaultExpression) {
+function convertZoomAndPropertyFunction(parameters, propertySpec, stops) {
   const featureFunctionParameters = {};
   const featureFunctionStops = {};
   const zoomStops = [];
@@ -107,15 +92,10 @@ function convertZoomAndPropertyFunction(parameters, propertySpec, stops, default
   // otherwise.
   const functionType = getFunctionType({}, propertySpec);
   if (functionType === 'exponential') {
-    const expression = ['interpolate', ['linear'], ['zoom']];
+    const expression = [getInterpolateOperator(parameters), ['linear'], ['zoom']];
 
     for (const z of zoomStops) {
-      const output = convertPropertyFunction(
-        featureFunctionParameters[z],
-        propertySpec,
-        featureFunctionStops[z],
-        defaultExpression
-      );
+      const output = convertPropertyFunction(featureFunctionParameters[z], propertySpec, featureFunctionStops[z]);
       appendStopPair(expression, z, output, false);
     }
 
@@ -124,12 +104,7 @@ function convertZoomAndPropertyFunction(parameters, propertySpec, stops, default
   const expression = ['step', ['zoom']];
 
   for (const z of zoomStops) {
-    const output = convertPropertyFunction(
-      featureFunctionParameters[z],
-      propertySpec,
-      featureFunctionStops[z],
-      defaultExpression
-    );
+    const output = convertPropertyFunction(featureFunctionParameters[z], propertySpec, featureFunctionStops[z]);
     appendStopPair(expression, z, output, true);
   }
 
@@ -138,43 +113,52 @@ function convertZoomAndPropertyFunction(parameters, propertySpec, stops, default
   return expression;
 }
 
-function convertPropertyFunction(parameters, propertySpec, stops, defaultExpression) {
-  const type = getFunctionType(parameters, propertySpec);
+function coalesce(a, b) {
+  if (a !== undefined) return a;
+  if (b !== undefined) return b;
+}
 
-  let expression;
-  let isStep = false;
+function convertPropertyFunction(parameters, propertySpec, stops) {
+  const type = getFunctionType(parameters, propertySpec);
+  const get = ['get', parameters.property];
   if (type === 'categorical' && typeof stops[0][0] === 'boolean') {
     assert(parameters.stops.length > 0 && parameters.stops.length <= 2);
-    expression = ['case'];
+    const expression = ['case'];
     for (const stop of stops) {
-      expression.push(['==', ['get', parameters.property], stop[0]], stop[1]);
+      expression.push(['==', get, stop[0]], stop[1]);
     }
-    expression.push(defaultExpression);
+    expression.push(convertLiteral(coalesce(parameters.default, propertySpec.default)));
     return expression;
   }
   if (type === 'categorical') {
-    expression = ['match', ['get', parameters.property]];
-  } else if (type === 'interval') {
-    expression = ['step', ['number', ['get', parameters.property]]];
-    isStep = true;
-  } else if (type === 'exponential') {
-    const base = parameters.base !== undefined ? parameters.base : 1;
-    expression = ['interpolate', ['exponential', base], ['number', ['get', parameters.property]]];
-  } else {
-    throw new Error(`Unknown property function type ${type}`);
+    const expression = ['match', get];
+    for (const stop of stops) {
+      appendStopPair(expression, stop[0], stop[1], false);
+    }
+    expression.push(convertLiteral(coalesce(parameters.default, propertySpec.default)));
+    return expression;
   }
-
-  for (const stop of stops) {
-    appendStopPair(expression, stop[0], stop[1], isStep);
+  if (type === 'interval') {
+    const expression = ['step', ['number', get]];
+    for (const stop of stops) {
+      appendStopPair(expression, stop[0], stop[1], true);
+    }
+    fixupDegenerateStepCurve(expression);
+    return parameters.default === undefined
+      ? expression
+      : ['case', ['==', ['typeof', get], 'number'], expression, convertLiteral(parameters.default)];
   }
-
-  if (expression[0] === 'match') {
-    expression.push(defaultExpression);
+  if (type === 'exponential') {
+    const base = parameters.base !== undefined ? parameters.base : 1;
+    const expression = [getInterpolateOperator(parameters), ['exponential', base], ['number', get]];
+    for (const stop of stops) {
+      appendStopPair(expression, stop[0], stop[1], false);
+    }
+    return parameters.default === undefined
+      ? expression
+      : ['case', ['==', ['typeof', get], 'number'], expression, convertLiteral(parameters.default)];
   }
-
-  fixupDegenerateStepCurve(expression);
-
-  return expression;
+  throw new Error(`Unknown property function type ${type}`);
 }
 
 function convertZoomFunction(parameters, propertySpec, stops, input = ['zoom']) {
@@ -186,7 +170,7 @@ function convertZoomFunction(parameters, propertySpec, stops, input = ['zoom'])
     isStep = true;
   } else if (type === 'exponential') {
     const base = parameters.base !== undefined ? parameters.base : 1;
-    expression = ['interpolate', ['exponential', base], input];
+    expression = [getInterpolateOperator(parameters), ['exponential', base], input];
   } else {
     throw new Error(`Unknown zoom function type "${type}"`);
   }
@@ -239,7 +223,7 @@ function convertTokenString(s) {
     const literal = s.slice(pos, re.lastIndex - match[0].length);
     pos = re.lastIndex;
     if (literal.length > 0) result.push(literal);
-    result.push(['to-string', ['get', match[1]]]);
+    result.push(['get', match[1]]);
   }
 
   if (result.length === 1) {
@@ -249,7 +233,7 @@ function convertTokenString(s) {
   if (pos < s.length) {
     result.push(s.slice(pos));
   } else if (result.length === 2) {
-    return result[1];
+    return ['to-string', result[1]];
   }
 
   return result;

package/src/style-spec/function/index.js

@@ -3,6 +3,7 @@ const Color = require('../util/color');
 const getType = require('../util/get_type');
 const interpolate = require('../util/interpolate');
 const Interpolate = require('../expression/definitions/interpolate');
+const { Formatted } = require('../expression/types/formatted');
 const { supportsInterpolation } = require('../util/properties');
 
 module.exports = {
@@ -203,6 +204,9 @@ function evaluateIdentityFunction(parameters, propertySpec, input) {
     case 'color':
       input = Color.parse(input);
       break;
+    case 'formatted':
+      input = Formatted.fromString(input.toString());
+      break;
     case 'enum':
       if (!propertySpec.values.includes(input)) {
         input = undefined;

package/src/style-spec/reference/v8.json

@@ -70,12 +70,12 @@
     },
     "sprite": {
       "type": "string",
-      "doc": "A base URL for retrieving the sprite image and metadata. The extensions `.png`, `.json` and scale factor `@2x.png` will be automatically appended. This property is required if any layer uses the `background-pattern`, `fill-pattern`, `line-pattern`, `fill-extrusion-pattern`, or `icon-image` properties.",
+      "doc": "A base URL for retrieving the sprite image and metadata. The extensions `.png`, `.json` and scale factor `@2x.png` will be automatically appended. This property is required if any layer uses the `background-pattern`, `fill-pattern`, `line-pattern`, `fill-extrusion-pattern`, or `icon-image` properties. The URL must be absolute, containing the [scheme, authority and path components](https://en.wikipedia.org/wiki/URL#Syntax).",
       "example": "mapbox://sprites/mapbox/bright-v8"
     },
     "glyphs": {
       "type": "string",
-      "doc": "A URL template for loading signed-distance-field glyph sets in PBF format. The URL must include `{fontstack}` and `{range}` tokens. This property is required if any layer uses the `text-field` layout property.",
+      "doc": "A URL template for loading signed-distance-field glyph sets in PBF format. The URL must include `{fontstack}` and `{range}` tokens. This property is required if any layer uses the `text-field` layout property. The URL must be absolute, containing the [scheme, authority and path components](https://en.wikipedia.org/wiki/URL#Syntax).",
       "example": "mapbox://fonts/mapbox/{fontstack}/{range}.pbf"
     },
     "transition": {
@@ -946,6 +946,32 @@
       },
       "property-type": "data-constant"
     },
+    "symbol-z-order": {
+      "type": "enum",
+      "values": {
+        "viewport-y": {
+          "doc": "Symbols will be sorted by their y-position relative to the viewport."
+        },
+        "source": {
+          "doc": "Symbols will be rendered in the same order as the source data with no sorting applied."
+        }
+      },
+      "default": "viewport-y",
+      "doc": "Controls the order in which overlapping symbols in the same layer are rendered",
+      "sdk-support": {
+        "basic functionality": {
+          "js": "0.49.0"
+        },
+        "data-driven styling": {}
+      },
+      "expression": {
+        "interpolated": false,
+        "parameters": [
+          "zoom"
+        ]
+      },
+      "property-type": "data-constant"
+    },
     "icon-allow-overlap": {
       "type": "boolean",
       "default": false,
@@ -3122,7 +3148,7 @@
         }
       },
       "concat": {
-        "doc": "Returns a `string` consisting of the concatenation of the inputs. If any inputs are `formatted`, returns a `formatted` with default formatting options for all unformatted inputs.",
+        "doc": "Returns a `string` consisting of the concatenation of the inputs. Each input is converted to a string as if by `to-string`.",
         "group": "String",
         "sdk-support": {
           "basic functionality": {
@@ -3458,7 +3484,10 @@
           "macos": "0.1.0"
         },
         "data-driven styling": {
-          "js": "0.46.0"
+          "js": "0.49.0",
+          "android": "6.5.0",
+          "macos": "0.11.0",
+          "ios": "4.4.0"
         }
       },
       "expression": {
@@ -3600,7 +3629,12 @@
           "ios": "3.6.0",
           "macos": "0.5.0"
         },
-        "data-driven styling": {}
+        "data-driven styling": {
+          "js": "0.49.0",
+          "android": "6.5.0",
+          "macos": "0.11.0",
+          "ios": "4.4.0"
+        }
       },
       "expression": {
         "interpolated": false,
@@ -3980,7 +4014,10 @@
           "macos": "0.1.0"
         },
         "data-driven styling": {
-          "js": "0.46.0"
+          "js": "0.49.0",
+          "android": "6.5.0",
+          "macos": "0.11.0",
+          "ios": "4.4.0"
         }
       },
       "expression": {

package/src/symbol/collision_index.js

@@ -99,7 +99,6 @@ class CollisionIndex {
     allowOverlap,
     scale,
     textPixelRatio,
-    key,
     symbol,
     lineVertexArray,
     glyphOffsetArray,

package/src/symbol/cross_tile_symbol_index.js

@@ -1,5 +1,7 @@
 const EXTENT = require('../data/extent');
 
+const { SymbolInstanceArray } = require('../data/array_types');
+
 /*
     The CrossTileSymbolIndex generally works on the assumption that
     a conceptual "unique symbol" can be identified by the text of
@@ -23,7 +25,8 @@ class TileLayerIndex {
     this.indexedSymbolInstances = {};
     this.bucketInstanceId = bucketInstanceId;
 
-    for (const symbolInstance of symbolInstances) {
+    for (let i = 0; i < symbolInstances.length; i++) {
+      const symbolInstance = symbolInstances.get(i);
       const key = symbolInstance.key;
       if (!this.indexedSymbolInstances[key]) {
         this.indexedSymbolInstances[key] = [];
@@ -46,10 +49,9 @@ class TileLayerIndex {
   getScaledCoordinates(symbolInstance, childTileID) {
     const zDifference = childTileID.canonical.z - this.tileID.canonical.z;
     const scale = roundingFactor / 2 ** zDifference;
-    const anchor = symbolInstance.anchor;
     return {
-      x: Math.floor((childTileID.canonical.x * EXTENT + anchor.x) * scale),
-      y: Math.floor((childTileID.canonical.y * EXTENT + anchor.y) * scale)
+      x: Math.floor((childTileID.canonical.x * EXTENT + symbolInstance.anchorX) * scale),
+      y: Math.floor((childTileID.canonical.y * EXTENT + symbolInstance.anchorY) * scale)
     };
   }
 
@@ -57,7 +59,8 @@ class TileLayerIndex {
     const tolerance =
       this.tileID.canonical.z < newTileID.canonical.z ? 1 : 2 ** (this.tileID.canonical.z - newTileID.canonical.z);
 
-    for (const symbolInstance of symbolInstances) {
+    for (let i = 0; i < symbolInstances.length; i++) {
+      const symbolInstance = symbolInstances.get(i);
       if (symbolInstance.crossTileID) {
         // already has a match, skip
         continue;
@@ -143,7 +146,8 @@ class CrossTileSymbolLayerIndex {
       this.removeBucketCrossTileIDs(tileID.overscaledZ, this.indexes[tileID.overscaledZ][tileID.key]);
     }
 
-    for (const symbolInstance of bucket.symbolInstances) {
+    for (let i = 0; i < bucket.symbolInstances.length; i++) {
+      const symbolInstance = bucket.symbolInstances.get(i);
       symbolInstance.crossTileID = 0;
     }
 
@@ -170,7 +174,8 @@ class CrossTileSymbolLayerIndex {
       }
     }
 
-    for (const symbolInstance of bucket.symbolInstances) {
+    for (let i = 0; i < bucket.symbolInstances.length; i++) {
+      const symbolInstance = bucket.symbolInstances.get(i);
       if (!symbolInstance.crossTileID) {
         // symbol did not match any known symbol, assign a new id
         symbolInstance.crossTileID = crossTileIDs.generate();

package/src/symbol/mergelines.js

@@ -1,4 +1,4 @@
-const { Formatted } = require('../style-spec/expression/definitions/formatted');
+const { Formatted } = require('../style-spec/expression/types/formatted');
 
 module.exports = function (features) {
   const leftIndex = new Map();
@@ -8,7 +8,7 @@ module.exports = function (features) {
 
   for (let k = 0; k < features.length; k++) {
     const { geometry, text: featureText } = features[k];
-    const text = featureText instanceof Formatted ? featureText.toString() : featureText;
+    const text = featureText ? featureText.toString() : null;
 
     if (!text) {
       add(k);

package/src/symbol/placement.js

@@ -170,9 +170,33 @@ class Placement {
     const textOptional = layout.get('text-optional');
     const iconOptional = layout.get('icon-optional');
 
+    const textAllowOverlap = layout.get('text-allow-overlap');
+    const iconAllowOverlap = layout.get('icon-allow-overlap');
+    // This logic is similar to the "defaultOpacityState" logic below in updateBucketOpacities
+    // If we know a symbol is always supposed to show, force it to be marked visible even if
+    // it wasn't placed into the collision index (because some or all of it was outside the range
+    // of the collision grid).
+    // There is a subtle edge case here we're accepting:
+    //  Symbol A has text-allow-overlap: true, icon-allow-overlap: true, icon-optional: false
+    //  A's icon is outside the grid, so doesn't get placed
+    //  A's text would be inside grid, but doesn't get placed because of icon-optional: false
+    //  We still show A because of the allow-overlap settings.
+    //  Symbol B has allow-overlap: false, and gets placed where A's text would be
+    //  On panning in, there is a short period when Symbol B and Symbol A will overlap
+    //  This is the reverse of our normal policy of "fade in on pan", but should look like any other
+    //  collision and hopefully not be too noticeable.
+    // See https://github.com/mapbox/mapbox-gl-js/issues/7172
+    const alwaysShowText = textAllowOverlap && (iconAllowOverlap || !bucket.hasIconData() || iconOptional);
+    const alwaysShowIcon = iconAllowOverlap && (textAllowOverlap || !bucket.hasTextData() || textOptional);
+
     const collisionGroup = this.collisionGroups.get(bucket.sourceID);
 
-    for (const symbolInstance of bucket.symbolInstances) {
+    if (!bucket.collisionArrays && collisionBoxArray) {
+      bucket.deserializeCollisionBoxes(collisionBoxArray);
+    }
+
+    for (let i = 0; i < bucket.symbolInstances.length; i++) {
+      const symbolInstance = bucket.symbolInstances.get(i);
       if (!seenCrossTileIDs[symbolInstance.crossTileID]) {
         if (holdingForFade) {
           // Mark all symbols from this tile as "not placed", but don't add to seenCrossTileIDs, because we don't
@@ -192,22 +216,14 @@ class Placement {
         let textFeatureIndex = 0;
         let iconFeatureIndex = 0;
 
-        if (!symbolInstance.collisionArrays) {
-          symbolInstance.collisionArrays = bucket.deserializeCollisionBoxes(
-            collisionBoxArray,
-            symbolInstance.textBoxStartIndex,
-            symbolInstance.textBoxEndIndex,
-            symbolInstance.iconBoxStartIndex,
-            symbolInstance.iconBoxEndIndex
-          );
-        }
+        const collisionArrays = bucket.collisionArrays[i];
 
-        if (symbolInstance.collisionArrays.textFeatureIndex) {
-          textFeatureIndex = symbolInstance.collisionArrays.textFeatureIndex;
+        if (collisionArrays.textFeatureIndex) {
+          textFeatureIndex = collisionArrays.textFeatureIndex;
         }
-        if (symbolInstance.collisionArrays.textBox) {
+        if (collisionArrays.textBox) {
           placedGlyphBoxes = this.collisionIndex.placeCollisionBox(
-            symbolInstance.collisionArrays.textBox,
+            collisionArrays.textBox,
             layout.get('text-allow-overlap'),
             textPixelRatio,
             posMatrix,
@@ -216,9 +232,9 @@ class Placement {
           placeText = placedGlyphBoxes.box.length > 0;
           offscreen = offscreen && placedGlyphBoxes.offscreen;
         }
-        const textCircles = symbolInstance.collisionArrays.textCircles;
+        const textCircles = collisionArrays.textCircles;
         if (textCircles) {
-          const placedSymbol = bucket.text.placedSymbolArray.get(symbolInstance.placedTextSymbolIndices[0]);
+          const placedSymbol = bucket.text.placedSymbolArray.get(symbolInstance.horizontalPlacedTextSymbolIndex);
           const fontSize = symbolSize.evaluateSizeForFeature(
             bucket.textSizeData,
             partiallyEvaluatedTextSize,
@@ -229,7 +245,6 @@ class Placement {
             layout.get('text-allow-overlap'),
             scale,
             textPixelRatio,
-            symbolInstance.key,
             placedSymbol,
             bucket.lineVertexArray,
             bucket.glyphOffsetArray,
@@ -248,12 +263,12 @@ class Placement {
           offscreen = offscreen && placedGlyphCircles.offscreen;
         }
 
-        if (symbolInstance.collisionArrays.iconFeatureIndex) {
-          iconFeatureIndex = symbolInstance.collisionArrays.iconFeatureIndex;
+        if (collisionArrays.iconFeatureIndex) {
+          iconFeatureIndex = collisionArrays.iconFeatureIndex;
         }
-        if (symbolInstance.collisionArrays.iconBox) {
+        if (collisionArrays.iconBox) {
           placedIconBoxes = this.collisionIndex.placeCollisionBox(
-            symbolInstance.collisionArrays.iconBox,
+            collisionArrays.iconBox,
             layout.get('icon-allow-overlap'),
             textPixelRatio,
             posMatrix,
@@ -308,8 +323,8 @@ class Placement {
         assert(bucket.bucketInstanceId !== 0);
 
         this.placements[symbolInstance.crossTileID] = new JointPlacement(
-          placeText,
-          placeIcon,
+          placeText || (alwaysShowText && placedGlyphBoxes),
+          placeIcon || alwaysShowIcon,
           offscreen || bucket.justReloaded
         );
         seenCrossTileIDs[symbolInstance.crossTileID] = true;
@@ -412,8 +427,16 @@ class Placement {
       true
     );
 
+    if (
+      !bucket.collisionArrays &&
+      collisionBoxArray &&
+      (bucket.hasCollisionBoxData() || bucket.hasCollisionCircleData())
+    ) {
+      bucket.deserializeCollisionBoxes(collisionBoxArray);
+    }
+
     for (let s = 0; s < bucket.symbolInstances.length; s++) {
-      const symbolInstance = bucket.symbolInstances[s];
+      const symbolInstance = bucket.symbolInstances.get(s);
       const isDuplicate = seenCrossTileIDs[symbolInstance.crossTileID];
 
       let opacityState = this.opacities[symbolInstance.crossTileID];
@@ -438,11 +461,14 @@ class Placement {
         for (let i = 0; i < opacityEntryCount; i++) {
           bucket.text.opacityVertexArray.emplaceBack(packedOpacity);
         }
-        for (const placedTextSymbolIndex of symbolInstance.placedTextSymbolIndices) {
-          const placedSymbol = bucket.text.placedSymbolArray.get(placedTextSymbolIndex);
-          // If this label is completely faded, mark it so that we don't have to calculate
-          // its position at render time
-          placedSymbol.hidden = opacityState.text.isHidden();
+        // If this label is completely faded, mark it so that we don't have to calculate
+        // its position at render time
+        bucket.text.placedSymbolArray.get(symbolInstance.horizontalPlacedTextSymbolIndex).hidden =
+          opacityState.text.isHidden();
+
+        if (symbolInstance.verticalPlacedTextSymbolIndex >= 0) {
+          bucket.text.placedSymbolArray.get(symbolInstance.verticalPlacedTextSymbolIndex).hidden =
+            opacityState.text.isHidden();
         }
       }
 
@@ -451,35 +477,26 @@ class Placement {
         for (let i = 0; i < symbolInstance.numIconVertices / 4; i++) {
           bucket.icon.opacityVertexArray.emplaceBack(packedOpacity);
         }
-        const placedSymbol = bucket.icon.placedSymbolArray.get(s);
-        placedSymbol.hidden = opacityState.icon.isHidden();
+        bucket.icon.placedSymbolArray.get(s).hidden = opacityState.icon.isHidden();
       }
 
-      if (!symbolInstance.collisionArrays) {
-        symbolInstance.collisionArrays = bucket.deserializeCollisionBoxes(
-          collisionBoxArray,
-          symbolInstance.textBoxStartIndex,
-          symbolInstance.textBoxEndIndex,
-          symbolInstance.iconBoxStartIndex,
-          symbolInstance.iconBoxEndIndex
-        );
-      }
-
-      const collisionArrays = symbolInstance.collisionArrays;
-      if (collisionArrays) {
-        if (collisionArrays.textBox && bucket.hasCollisionBoxData()) {
-          updateCollisionVertices(bucket.collisionBox.collisionVertexArray, opacityState.text.placed, false);
-        }
+      if (bucket.hasCollisionBoxData() || bucket.hasCollisionCircleData()) {
+        const collisionArrays = bucket.collisionArrays[s];
+        if (collisionArrays) {
+          if (collisionArrays.textBox) {
+            updateCollisionVertices(bucket.collisionBox.collisionVertexArray, opacityState.text.placed, false);
+          }
 
-        if (collisionArrays.iconBox && bucket.hasCollisionBoxData()) {
-          updateCollisionVertices(bucket.collisionBox.collisionVertexArray, opacityState.icon.placed, false);
-        }
+          if (collisionArrays.iconBox) {
+            updateCollisionVertices(bucket.collisionBox.collisionVertexArray, opacityState.icon.placed, false);
+          }
 
-        const textCircles = collisionArrays.textCircles;
-        if (textCircles && bucket.hasCollisionCircleData()) {
-          for (let k = 0; k < textCircles.length; k += 5) {
-            const notUsed = isDuplicate || textCircles[k + 4] === 0;
-            updateCollisionVertices(bucket.collisionCircle.collisionVertexArray, opacityState.text.placed, notUsed);
+          const textCircles = collisionArrays.textCircles;
+          if (textCircles && bucket.hasCollisionCircleData()) {
+            for (let k = 0; k < textCircles.length; k += 5) {
+              const notUsed = isDuplicate || textCircles[k + 4] === 0;
+              updateCollisionVertices(bucket.collisionCircle.collisionVertexArray, opacityState.text.placed, notUsed);
+            }
           }
         }
       }