@cesium/engine 1.0.0 → 2.0.0

package/Source/Scene/PostProcessStage.js

@@ -40,7 +40,7 @@ import PostProcessStageSampleMode from "./PostProcessStageSampleMode.js";
  *
  * @exception {DeveloperError} options.textureScale must be greater than 0.0 and less than or equal to 1.0.
  * @exception {DeveloperError} options.pixelFormat must be a color format.
- * @exception {DeveloperError} When options.pixelDatatype is FLOAT, this WebGL implementation must support the OES_texture_float extension.  Check context.floatingPointTexture.
+ * @exception {DeveloperError} When options.pixelDatatype is FLOAT, this WebGL implementation must support floating point textures. Check context.floatingPointTexture.
  *
  * @see PostProcessStageComposite
  *
@@ -48,12 +48,12 @@ import PostProcessStageSampleMode from "./PostProcessStageSampleMode.js";
  * // Simple stage to change the color
  * const fs =`
  *     uniform sampler2D colorTexture;
- *     varying vec2 v_textureCoordinates;
+ *     in vec2 v_textureCoordinates;
  *     uniform float scale;
  *     uniform vec3 offset;
  *     void main() {
- *         vec4 color = texture2D(colorTexture, v_textureCoordinates);
- *         gl_FragColor = vec4(color.rgb * scale + offset, 1.0);
+ *         vec4 color = texture(colorTexture, v_textureCoordinates);
+ *         out_FragColor = vec4(color.rgb * scale + offset, 1.0);
  *     }`;
  * scene.postProcessStages.add(new Cesium.PostProcessStage({
  *     fragmentShader : fs,
@@ -70,15 +70,15 @@ import PostProcessStageSampleMode from "./PostProcessStageSampleMode.js";
  * // If czm_selected returns true, the current fragment belongs to geometry in the selected array.
  * const fs =`
  *     uniform sampler2D colorTexture;
- *     varying vec2 v_textureCoordinates;
+ *     in vec2 v_textureCoordinates;
  *     uniform vec4 highlight;
  *     void main() {
- *         vec4 color = texture2D(colorTexture, v_textureCoordinates);
+ *         vec4 color = texture(colorTexture, v_textureCoordinates);
  *         if (czm_selected()) {
  *             vec3 highlighted = highlight.a * highlight.rgb + (1.0 - highlight.a) * color.rgb;
- *             gl_FragColor = vec4(highlighted, 1.0);
+ *             out_FragColor = vec4(highlighted, 1.0);
  *         } else {
- *             gl_FragColor = color;
+ *             out_FragColor = color;
  *         }
  *     }`;
  * const stage = scene.postProcessStages.add(new Cesium.PostProcessStage({
@@ -364,7 +364,7 @@ Object.defineProperties(PostProcessStage.prototype, {
    * if (czm_selected(v_textureCoordinates)) {
    *     // apply post-process stage
    * } else {
-   *     gl_FragColor = texture2D(colorTexture, v_textureCoordinates);
+   *     out_FragColor = texture(colorTexture, v_textureCoordinates);
    * }
    * </code>
    * </p>
@@ -556,22 +556,22 @@ function createDrawCommand(stage, context) {
   if (defined(stage._selectedIdTexture)) {
     const width = stage._selectedIdTexture.width;
 
-    fs = fs.replace(/varying\s+vec2\s+v_textureCoordinates;/g, "");
+    fs = fs.replace(/in\s+vec2\s+v_textureCoordinates;/g, "");
     fs =
       `${
         "#define CZM_SELECTED_FEATURE \n" +
         "uniform sampler2D czm_idTexture; \n" +
         "uniform sampler2D czm_selectedIdTexture; \n" +
         "uniform float czm_selectedIdTextureStep; \n" +
-        "varying vec2 v_textureCoordinates; \n" +
+        "in vec2 v_textureCoordinates; \n" +
         "bool czm_selected(vec2 offset) \n" +
         "{ \n" +
         "    bool selected = false;\n" +
-        "    vec4 id = texture2D(czm_idTexture, v_textureCoordinates + offset); \n" +
+        "    vec4 id = texture(czm_idTexture, v_textureCoordinates + offset); \n" +
         "    for (int i = 0; i < "
       }${width}; ++i) \n` +
       `    { \n` +
-      `        vec4 selectedId = texture2D(czm_selectedIdTexture, vec2((float(i) + 0.5) * czm_selectedIdTextureStep, 0.5)); \n` +
+      `        vec4 selectedId = texture(czm_selectedIdTexture, vec2((float(i) + 0.5) * czm_selectedIdTextureStep, 0.5)); \n` +
       `        if (all(equal(id, selectedId))) \n` +
       `        { \n` +
       `            return true; \n` +

package/Source/Scene/PostProcessStageLibrary.js

@@ -283,7 +283,7 @@ function getSilhouetteEdgeDetection(edgeDetectionStages) {
   for (let i = 0; i < edgeDetectionStages.length; ++i) {
     fsDecl += `uniform sampler2D edgeTexture${i}; \n`;
     fsLoop +=
-      `        vec4 edge${i} = texture2D(edgeTexture${i}, v_textureCoordinates); \n` +
+      `        vec4 edge${i} = texture(edgeTexture${i}, v_textureCoordinates); \n` +
       `        if (edge${i}.a > 0.0) \n` +
       `        { \n` +
       `            color = edge${i}; \n` +
@@ -293,12 +293,12 @@ function getSilhouetteEdgeDetection(edgeDetectionStages) {
   }
 
   const fs =
-    `${fsDecl}varying vec2 v_textureCoordinates; \n` +
+    `${fsDecl}in vec2 v_textureCoordinates; \n` +
     `void main() { \n` +
     `    vec4 color = vec4(0.0); \n` +
     `    for (int i = 0; i < ${edgeDetectionStages.length}; i++) \n` +
     `    { \n${fsLoop}    } \n` +
-    `    gl_FragColor = color; \n` +
+    `    out_FragColor = color; \n` +
     `} \n`;
 
   const edgeComposite = new PostProcessStage({

package/Source/Scene/Primitive.js

@@ -743,7 +743,7 @@ function cloneInstance(instance, geometry) {
   };
 }
 
-const positionRegex = /attribute\s+vec(?:3|4)\s+(.*)3DHigh;/g;
+const positionRegex = /in\s+vec(?:3|4)\s+(.*)3DHigh;/g;
 
 Primitive._modifyShaderPosition = function (
   primitive,
@@ -771,8 +771,7 @@ Primitive._modifyShaderPosition = function (
     if (!defined(primitive.rtcCenter)) {
       // Use GPU RTE
       if (!scene3DOnly) {
-        attributes +=
-          `attribute vec3 ${name}2DHigh;\n` + `attribute vec3 ${name}2DLow;\n`;
+        attributes += `in vec3 ${name}2DHigh;\nin vec3 ${name}2DLow;\n`;
 
         computeFunctions +=
           `${functionName}\n` +
@@ -805,16 +804,16 @@ Primitive._modifyShaderPosition = function (
     } else {
       // Use RTC
       vertexShaderSource = vertexShaderSource.replace(
-        /attribute\s+vec(?:3|4)\s+position3DHigh;/g,
+        /in\s+vec(?:3|4)\s+position3DHigh;/g,
         ""
       );
       vertexShaderSource = vertexShaderSource.replace(
-        /attribute\s+vec(?:3|4)\s+position3DLow;/g,
+        /in\s+vec(?:3|4)\s+position3DLow;/g,
         ""
       );
 
       forwardDecl += "uniform mat4 u_modifiedModelView;\n";
-      attributes += "attribute vec4 position;\n";
+      attributes += "in vec4 position;\n";
 
       computeFunctions +=
         `${functionName}\n` +
@@ -871,7 +870,7 @@ Primitive._updateColorAttribute = function (
     return vertexShaderSource;
   }
 
-  if (vertexShaderSource.search(/attribute\s+vec4\s+color;/g) === -1) {
+  if (vertexShaderSource.search(/in\s+vec4\s+color;/g) === -1) {
     return vertexShaderSource;
   }
 
@@ -887,7 +886,7 @@ Primitive._updateColorAttribute = function (
   //>>includeEnd('debug');
 
   let modifiedVS = vertexShaderSource;
-  modifiedVS = modifiedVS.replace(/attribute\s+vec4\s+color;/g, "");
+  modifiedVS = modifiedVS.replace(/in\s+vec4\s+color;/g, "");
   if (!isDepthFail) {
     modifiedVS = modifiedVS.replace(
       /(\b)color(\b)/g,
@@ -905,7 +904,7 @@ Primitive._updateColorAttribute = function (
 function appendPickToVertexShader(source) {
   const renamedVS = ShaderSource.replaceMain(source, "czm_non_pick_main");
   const pickMain =
-    "varying vec4 v_pickColor; \n" +
+    "out vec4 v_pickColor; \n" +
     "void main() \n" +
     "{ \n" +
     "    czm_non_pick_main(); \n" +
@@ -916,11 +915,11 @@ function appendPickToVertexShader(source) {
 }
 
 function appendPickToFragmentShader(source) {
-  return `varying vec4 v_pickColor;\n${source}`;
+  return `in vec4 v_pickColor;\n${source}`;
 }
 
 Primitive._updatePickColorAttribute = function (source) {
-  let vsPick = source.replace(/attribute\s+vec4\s+pickColor;/g, "");
+  let vsPick = source.replace(/in\s+vec4\s+pickColor;/g, "");
   vsPick = vsPick.replace(
     /(\b)pickColor(\b)/g,
     "$1czm_batchTable_pickColor(batchId)$2"
@@ -933,10 +932,10 @@ Primitive._appendOffsetToShader = function (primitive, vertexShaderSource) {
     return vertexShaderSource;
   }
 
-  let attr = "attribute float batchId;\n";
-  attr += "attribute float applyOffset;";
+  let attr = "in float batchId;\n";
+  attr += "in float applyOffset;";
   let modifiedShader = vertexShaderSource.replace(
-    /attribute\s+float\s+batchId;/g,
+    /in\s+float\s+batchId;/g,
     attr
   );
 
@@ -1033,17 +1032,16 @@ function modifyForEncodedNormals(primitive, vertexShaderSource) {
   }
 
   const containsNormal =
-    vertexShaderSource.search(/attribute\s+vec3\s+normal;/g) !== -1;
-  const containsSt =
-    vertexShaderSource.search(/attribute\s+vec2\s+st;/g) !== -1;
+    vertexShaderSource.search(/in\s+vec3\s+normal;/g) !== -1;
+  const containsSt = vertexShaderSource.search(/in\s+vec2\s+st;/g) !== -1;
   if (!containsNormal && !containsSt) {
     return vertexShaderSource;
   }
 
   const containsTangent =
-    vertexShaderSource.search(/attribute\s+vec3\s+tangent;/g) !== -1;
+    vertexShaderSource.search(/in\s+vec3\s+tangent;/g) !== -1;
   const containsBitangent =
-    vertexShaderSource.search(/attribute\s+vec3\s+bitangent;/g) !== -1;
+    vertexShaderSource.search(/in\s+vec3\s+bitangent;/g) !== -1;
 
   let numComponents = containsSt && containsNormal ? 2.0 : 1.0;
   numComponents += containsTangent || containsBitangent ? 1 : 0;
@@ -1051,7 +1049,7 @@ function modifyForEncodedNormals(primitive, vertexShaderSource) {
   const type = numComponents > 1 ? `vec${numComponents}` : "float";
 
   const attributeName = "compressedAttributes";
-  const attributeDecl = `attribute ${type} ${attributeName};`;
+  const attributeDecl = `in ${type} ${attributeName};`;
 
   let globalDecl = "";
   let decode = "";
@@ -1092,10 +1090,10 @@ function modifyForEncodedNormals(primitive, vertexShaderSource) {
   }
 
   let modifiedVS = vertexShaderSource;
-  modifiedVS = modifiedVS.replace(/attribute\s+vec3\s+normal;/g, "");
-  modifiedVS = modifiedVS.replace(/attribute\s+vec2\s+st;/g, "");
-  modifiedVS = modifiedVS.replace(/attribute\s+vec3\s+tangent;/g, "");
-  modifiedVS = modifiedVS.replace(/attribute\s+vec3\s+bitangent;/g, "");
+  modifiedVS = modifiedVS.replace(/in\s+vec3\s+normal;/g, "");
+  modifiedVS = modifiedVS.replace(/in\s+vec2\s+st;/g, "");
+  modifiedVS = modifiedVS.replace(/in\s+vec3\s+tangent;/g, "");
+  modifiedVS = modifiedVS.replace(/in\s+vec3\s+bitangent;/g, "");
   modifiedVS = ShaderSource.replaceMain(modifiedVS, "czm_non_compressed_main");
   const compressedMain =
     `${"void main() \n" + "{ \n"}${decode}    czm_non_compressed_main(); \n` +
@@ -1125,19 +1123,12 @@ function depthClampFS(fragmentShaderSource) {
   modifiedFS +=
     "void main() {\n" +
     "    czm_non_depth_clamp_main();\n" +
-    "#if defined(GL_EXT_frag_depth)\n" +
     "    #if defined(LOG_DEPTH)\n" +
     "        czm_writeLogDepth();\n" +
     "    #else\n" +
     "        czm_writeDepthClamp();\n" +
     "    #endif\n" +
-    "#endif\n" +
     "}\n";
-  modifiedFS = `${
-    "#ifdef GL_EXT_frag_depth\n" +
-    "#extension GL_EXT_frag_depth : enable\n" +
-    "#endif\n"
-  }${modifiedFS}`;
   return modifiedFS;
 }
 

package/Source/Scene/PropertyAttribute.js

@@ -112,7 +112,7 @@ Object.defineProperties(PropertyAttribute.prototype, {
   },
 
   /**
-   * Extras in the JSON object.
+   * Extra user-defined properties.
    *
    * @memberof PropertyAttribute.prototype
    *
@@ -127,7 +127,7 @@ Object.defineProperties(PropertyAttribute.prototype, {
   },
 
   /**
-   * Extensions in the JSON object.
+   * An object containing extensions.
    *
    * @memberof PropertyAttribute.prototype
    *

package/Source/Scene/PropertyAttributeProperty.js

@@ -134,7 +134,7 @@ Object.defineProperties(PropertyAttributeProperty.prototype, {
   },
 
   /**
-   * Extras in the JSON object.
+   * Extra user-defined properties.
    *
    * @memberof PropertyAttributeProperty.prototype
    * @type {*}
@@ -148,7 +148,7 @@ Object.defineProperties(PropertyAttributeProperty.prototype, {
   },
 
   /**
-   * Extensions in the JSON object.
+   * An object containing extensions.
    *
    * @memberof PropertyAttributeProperty.prototype
    * @type {*}

package/Source/Scene/PropertyTable.js

@@ -113,7 +113,7 @@ Object.defineProperties(PropertyTable.prototype, {
   },
 
   /**
-   * Extras in the JSON object.
+   * Extra user-defined properties.
    *
    * @memberof PropertyTable.prototype
    * @type {*}
@@ -127,7 +127,7 @@ Object.defineProperties(PropertyTable.prototype, {
   },
 
   /**
-   * Extensions in the JSON object.
+   * An object containing extensions.
    *
    * @memberof PropertyTable.prototype
    * @type {Object}

package/Source/Scene/PropertyTexture.js

@@ -116,7 +116,7 @@ Object.defineProperties(PropertyTexture.prototype, {
   },
 
   /**
-   * Extras in the JSON object.
+   * Extra user-defined properties.
    *
    * @memberof PropertyTexture.prototype
    * @type {*}
@@ -130,7 +130,7 @@ Object.defineProperties(PropertyTexture.prototype, {
   },
 
   /**
-   * Extensions in the JSON object.
+   * An object containing extensions.
    *
    * @memberof PropertyTexture.prototype
    * @type {Object}

package/Source/Scene/PropertyTextureProperty.js

@@ -150,7 +150,7 @@ Object.defineProperties(PropertyTextureProperty.prototype, {
   },
 
   /**
-   * Extras in the JSON object.
+   * Extra user-defined properties.
    *
    * @memberof PropertyTextureProperty.prototype
    * @type {*}
@@ -164,7 +164,7 @@ Object.defineProperties(PropertyTextureProperty.prototype, {
   },
 
   /**
-   * Extensions in the JSON object.
+   * An object containing extensions.
    *
    * @memberof PropertyTextureProperty.prototype
    * @type {*}

package/Source/Scene/ResourceCache.js

@@ -476,7 +476,7 @@ ResourceCache.loadVertexBuffer = function (options) {
   }
 
   const hasBufferViewId = defined(bufferViewId);
-  const hasDraco = defined(draco);
+  const hasDraco = hasDracoCompression(draco, attributeSemantic);
   const hasAttributeSemantic = defined(attributeSemantic);
   const hasAccessorId = defined(accessorId);
 
@@ -553,6 +553,14 @@ ResourceCache.loadVertexBuffer = function (options) {
   return vertexBufferLoader;
 };
 
+function hasDracoCompression(draco, semantic) {
+  return (
+    defined(draco) &&
+    defined(draco.attributes) &&
+    defined(draco.attributes[semantic])
+  );
+}
+
 /**
  * Loads a glTF index buffer from the cache.
  *

package/Source/Scene/ResourceCacheKey.js

@@ -327,7 +327,7 @@ ResourceCacheKey.getVertexBufferCacheKey = function (options) {
   Check.typeOf.object("options.frameState", frameState);
 
   const hasBufferViewId = defined(bufferViewId);
-  const hasDraco = defined(draco);
+  const hasDraco = hasDracoCompression(draco, attributeSemantic);
   const hasAttributeSemantic = defined(attributeSemantic);
 
   if (hasBufferViewId === hasDraco) {
@@ -394,6 +394,14 @@ ResourceCacheKey.getVertexBufferCacheKey = function (options) {
   return `vertex-buffer:${bufferCacheKey}-range-${bufferViewCacheKey}${cacheKeySuffix}`;
 };
 
+function hasDracoCompression(draco, semantic) {
+  return (
+    defined(draco) &&
+    defined(draco.attributes) &&
+    defined(draco.attributes[semantic])
+  );
+}
+
 /**
  * Gets the index buffer cache key.
  *

package/Source/Scene/Scene.js

@@ -2215,6 +2215,17 @@ function executeTranslucentCommandsFrontToBack(
   }
 }
 
+function executeVoxelCommands(scene, executeFunction, passState, commands) {
+  const context = scene.context;
+
+  mergeSort(commands, backToFront, scene.camera.positionWC);
+
+  const length = commands.length;
+  for (let i = 0; i < length; ++i) {
+    executeFunction(commands[i], scene, context, passState);
+  }
+}
+
 const scratchPerspectiveFrustum = new PerspectiveFrustum();
 const scratchPerspectiveOffCenterFrustum = new PerspectiveOffCenterFrustum();
 const scratchOrthographicFrustum = new OrthographicFrustum();
@@ -2623,6 +2634,12 @@ function executeCommands(scene, passState) {
       pickDepth.executeCopyDepth(context, passState);
     }
 
+    us.updatePass(Pass.VOXELS);
+    commands = frustumCommands.commands[Pass.VOXELS];
+    length = frustumCommands.indices[Pass.VOXELS];
+    commands.length = length;
+    executeVoxelCommands(scene, executeCommand, passState, commands);
+
     if (picking || !usePostProcessSelected) {
       continue;
     }

package/Source/Scene/ShadowMap.js

@@ -763,7 +763,7 @@ function createDebugShadowViewCommand(shadowMap, context) {
   if (shadowMap._isPointLight) {
     fs =
       "uniform samplerCube shadowMap_textureCube; \n" +
-      "varying vec2 v_textureCoordinates; \n" +
+      "in vec2 v_textureCoordinates; \n" +
       "void main() \n" +
       "{ \n" +
       "    vec2 uv = v_textureCoordinates; \n" +
@@ -812,21 +812,21 @@ function createDebugShadowViewCommand(shadowMap, context) {
       "        } \n" +
       "    } \n" +
       " \n" +
-      "    float shadow = czm_unpackDepth(textureCube(shadowMap_textureCube, dir)); \n" +
-      "    gl_FragColor = vec4(vec3(shadow), 1.0); \n" +
+      "    float shadow = czm_unpackDepth(czm_textureCube(shadowMap_textureCube, dir)); \n" +
+      "    out_FragColor = vec4(vec3(shadow), 1.0); \n" +
       "} \n";
   } else {
     fs =
       `${
         "uniform sampler2D shadowMap_texture; \n" +
-        "varying vec2 v_textureCoordinates; \n" +
+        "in vec2 v_textureCoordinates; \n" +
         "void main() \n" +
         "{ \n"
       }${
         shadowMap._usesDepthTexture
-          ? "    float shadow = texture2D(shadowMap_texture, v_textureCoordinates).r; \n"
-          : "    float shadow = czm_unpackDepth(texture2D(shadowMap_texture, v_textureCoordinates)); \n"
-      }    gl_FragColor = vec4(vec3(shadow), 1.0); \n` + `} \n`;
+          ? "    float shadow = texture(shadowMap_texture, v_textureCoordinates).r; \n"
+          : "    float shadow = czm_unpackDepth(texture(shadowMap_texture, v_textureCoordinates)); \n"
+      }    out_FragColor = vec4(vec3(shadow), 1.0); \n` + `} \n`;
   }
 
   const drawCommand = context.createViewportQuadCommand(fs, {

package/Source/Scene/ShadowMapShader.js

@@ -39,7 +39,7 @@ ShadowMapShader.createShadowCastVertexShader = function (
     }
 
     const shadowVS =
-      "varying vec3 v_positionEC; \n" +
+      "in vec3 v_positionEC; \n" +
       "void main() \n" +
       "{ \n" +
       "    czm_shadow_cast_main(); \n" +
@@ -80,7 +80,7 @@ ShadowMapShader.createShadowCastFragmentShader = function (
 
   if (isPointLight) {
     if (!hasPositionVarying) {
-      fsSource += "varying vec3 v_positionEC; \n";
+      fsSource += "in vec3 v_positionEC; \n";
     }
     fsSource += "uniform vec4 shadowMap_lightPositionEC; \n";
   }
@@ -92,7 +92,7 @@ ShadowMapShader.createShadowCastFragmentShader = function (
       "void main() \n" +
       "{ \n" +
       "    czm_shadow_cast_main(); \n" +
-      "    if (gl_FragColor.a == 0.0) \n" +
+      "    if (out_FragColor.a == 0.0) \n" +
       "    { \n" +
       "       discard; \n" +
       "    } \n";
@@ -106,11 +106,11 @@ ShadowMapShader.createShadowCastFragmentShader = function (
       `        discard; \n` +
       `    } \n` +
       `    distance /= shadowMap_lightPositionEC.w; // radius \n` +
-      `    gl_FragColor = czm_packDepth(distance); \n`;
+      `    out_FragColor = czm_packDepth(distance); \n`;
   } else if (usesDepthTexture) {
-    fsSource += "    gl_FragColor = vec4(1.0); \n";
+    fsSource += "    out_FragColor = vec4(1.0); \n";
   } else {
-    fsSource += "    gl_FragColor = czm_packDepth(gl_FragCoord.z); \n";
+    fsSource += "    out_FragColor = czm_packDepth(gl_FragCoord.z); \n";
   }
 
   fsSource += "} \n";
@@ -257,7 +257,7 @@ ShadowMapShader.createShadowReceiveFragmentShader = function (
       "uniform vec4 shadowMap_normalOffsetScaleDistanceMaxDistanceAndDarkness; \n" +
       "uniform vec4 shadowMap_texelSizeDepthBiasAndNormalShadingSmooth; \n" +
       "#ifdef LOG_DEPTH \n" +
-      "varying vec3 v_logPositionEC; \n" +
+      "in vec3 v_logPositionEC; \n" +
       "#endif \n" +
       "vec4 getPositionEC() \n" +
       "{ \n"
@@ -364,7 +364,7 @@ ShadowMapShader.createShadowReceiveFragmentShader = function (
     }${
       debugCascadeColors
         ? "    // Draw cascade colors for debugging \n" +
-          "    gl_FragColor *= czm_cascadeColor(weights); \n"
+          "    out_FragColor *= czm_cascadeColor(weights); \n"
         : ""
     }`;
   } else {
@@ -383,7 +383,7 @@ ShadowMapShader.createShadowReceiveFragmentShader = function (
       "    float visibility = czm_shadowVisibility(shadowMap_texture, shadowParameters); \n";
   }
 
-  fsSource += "    gl_FragColor.rgb *= visibility; \n" + "} \n";
+  fsSource += "    out_FragColor.rgb *= visibility; \n" + "} \n";
 
   sources.push(fsSource);
 

package/Source/Scene/ShadowVolumeAppearance.js

@@ -168,7 +168,7 @@ ShadowVolumeAppearance.prototype.createPickFragmentShader = function (
   return new ShaderSource({
     defines: defines,
     sources: [ShadowVolumeAppearanceFS],
-    pickColorQualifier: "varying",
+    pickColorQualifier: "in",
   });
 };