ol 10.0.1-dev.1723471742506 → 10.0.1-dev.1723624515788

package/expr/gpu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"gpu.d.ts","sourceRoot":"","sources":["gpu.js"],"names":[],"mappings":"AA8BA;;;;GAIG;AACH,gCAHW,MAAM,GACL,MAAM,CAKjB;AAED;;;;GAIG;AACH,mCAHW,KAAK,CAAC,MAAM,CAAC,GACZ,MAAM,CASjB;AAED;;;;;;GAMG;AACH,mCALW,MAAM,GAAC,OAAO,aAAa,EAAE,KAAK,GAGjC,MAAM,CAYjB;AAED;;;;GAIG;AACH,iCAHW,MAAM,GAAC,OAAO,YAAY,EAAE,IAAI,GAC/B,MAAM,CAKjB;AAMD;;;;GAIG;AACH,kDAHW,MAAM,GACL,MAAM,CAOjB;AAED;;;;;;GAMG;AACH,qCAHW,MAAM,GACL,MAAM,CAIjB;AAED;;;;GAIG;AACH,qDAHW,MAAM,GACL,MAAM,CAIjB;AAED;;GAEG;AACH;;;GAGG;AACH;;;GAGG;AAEH;;;;;GAKG;AAEH;;;;;GAKG;AAEH;;;;;;;;;GASG;AAEH;;GAEG;AACH,yCAFY,kBAAkB,CAW7B;AAMD;;GAEG;AAEH;;;GAGG;AAEH;;;;;;GAMG;AACH,yCANW,OAAO,iBAAiB,EAAE,iBAAiB,QAC3C,MAAM,kBACN,OAAO,iBAAiB,EAAE,cAAc,sBACxC,kBAAkB,GACjB,kBAAkB,CAU7B;AA1BD,wDAAyD;6BApD5C,OAAO,iBAAiB,EAAE,cAAc;yBAIxC,OAAO,iBAAiB,EAAE,UAAU;gCAIpC,OAAO,iBAAiB,EAAE,iBAAiB;;;;;UAK1C,MAAM;;;;UACN,MAAM;;;;wBACG,OAAO,eAAe,EAAE,WAAW,KAAG,GAAC;;;;;;UAKhD,MAAM;;;;UACN,MAAM;;;;gCACY,GAAC;;;;;;;;;;gBAMnB;YAAO,MAAM,GAAE,0BAA0B;KAAC;;;;eAC1C;YAAO,MAAM,GAAE,0BAA0B;KAAC;;;;eAC1C;YAAO,MAAM,GAAE,MAAM;KAAC;;;;;;;;;;;;WAGtB,OAAO,mBAAmB,EAAE,UAAU;;iCAsBvC,MAAM;;;;uBAIN,CAAS,IAAkB,EAAlB,kBAAkB,EAAE,IAAc,EAAd,cAAc,EAAE,IAAM,EAAN,MAAM,KAAG,MAAM;2BAhL9C,4BAA4B;+BAahD,iBAAiB"}
+{"version":3,"file":"gpu.d.ts","sourceRoot":"","sources":["gpu.js"],"names":[],"mappings":"AA8BA;;;;GAIG;AACH,gCAHW,MAAM,GACL,MAAM,CAKjB;AAED;;;;GAIG;AACH,mCAHW,KAAK,CAAC,MAAM,CAAC,GACZ,MAAM,CASjB;AAED;;;;;;GAMG;AACH,mCALW,MAAM,GAAC,OAAO,aAAa,EAAE,KAAK,GAGjC,MAAM,CAMjB;AAED;;;;GAIG;AACH,iCAHW,MAAM,GAAC,OAAO,YAAY,EAAE,IAAI,GAC/B,MAAM,CAKjB;AAMD;;;;GAIG;AACH,kDAHW,MAAM,GACL,MAAM,CAOjB;AAED;;;;;;GAMG;AACH,qCAHW,MAAM,GACL,MAAM,CAIjB;AAED;;;;GAIG;AACH,qDAHW,MAAM,GACL,MAAM,CAIjB;AAED;;GAEG;AACH;;;GAGG;AACH;;;GAGG;AAEH;;;;;GAKG;AAEH;;;;;GAKG;AAEH;;;;;;;;;GASG;AAEH;;GAEG;AACH,yCAFY,kBAAkB,CAW7B;AAMD;;GAEG;AAEH;;;GAGG;AAEH;;;;;;GAMG;AACH,yCANW,OAAO,iBAAiB,EAAE,iBAAiB,QAC3C,MAAM,kBACN,OAAO,iBAAiB,EAAE,cAAc,sBACxC,kBAAkB,GACjB,kBAAkB,CAU7B;AA1BD,wDAAyD;6BApD5C,OAAO,iBAAiB,EAAE,cAAc;yBAIxC,OAAO,iBAAiB,EAAE,UAAU;gCAIpC,OAAO,iBAAiB,EAAE,iBAAiB;;;;;UAK1C,MAAM;;;;UACN,MAAM;;;;wBACG,OAAO,eAAe,EAAE,WAAW,KAAG,GAAC;;;;;;UAKhD,MAAM;;;;UACN,MAAM;;;;gCACY,GAAC;;;;;;;;;;gBAMnB;YAAO,MAAM,GAAE,0BAA0B;KAAC;;;;eAC1C;YAAO,MAAM,GAAE,0BAA0B;KAAC;;;;eAC1C;YAAO,MAAM,GAAE,MAAM;KAAC;;;;;;;;;;;;WAGtB,OAAO,mBAAmB,EAAE,UAAU;;iCAsBvC,MAAM;;;;uBAIN,CAAS,IAAkB,EAAlB,kBAAkB,EAAE,IAAc,EAAd,cAAc,EAAE,IAAM,EAAN,MAAM,KAAG,MAAM;2BA1K9C,4BAA4B;+BAahD,iBAAiB"}

package/expr/gpu.js

@@ -62,13 +62,7 @@ export function arrayToGlsl(array) {
 export function colorToGlsl(color) {
   const array = asArray(color);
   const alpha = array.length > 3 ? array[3] : 1;
-  // all components are premultiplied with alpha value
-  return arrayToGlsl([
-    (array[0] / 255) * alpha,
-    (array[1] / 255) * alpha,
-    (array[2] / 255) * alpha,
-    alpha,
-  ]);
+  return arrayToGlsl([array[0] / 255, array[1] / 255, array[2] / 255, alpha]);
 }
 
 /**
@@ -371,14 +365,14 @@ ${tests.join('\n')}
     }
     if (compiledArgs.length === 2) {
       //grayscale with alpha
-      return `(${compiledArgs[1]} * vec4(vec3(${compiledArgs[0]} / 255.0), 1.0))`;
+      return `vec4(vec3(${compiledArgs[0]} / 255.0), ${compiledArgs[1]})`;
     }
     const rgb = compiledArgs.slice(0, 3).map((color) => `${color} / 255.0`);
     if (compiledArgs.length === 3) {
       return `vec4(${rgb.join(', ')}, 1.0)`;
     }
     const alpha = compiledArgs[3];
-    return `(${alpha} * vec4(${rgb.join(', ')}, 1.0))`;
+    return `vec4(${rgb.join(', ')}, ${alpha})`;
   }),
   [Ops.Band]: createCompiler(([band, xOffset, yOffset], context) => {
     if (!(GET_BAND_VALUE_FUNC in context.functions)) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ol",
-  "version": "10.0.1-dev.1723471742506",
+  "version": "10.0.1-dev.1723624515788",
   "description": "OpenLayers mapping library",
   "keywords": [
     "map",
@@ -22,6 +22,7 @@
     "url": "https://opencollective.com/openlayers"
   },
   "dependencies": {
+    "@types/rbush": "^3.0.3",
     "color-rgba": "^3.0.0",
     "color-space": "^2.0.1",
     "earcut": "^3.0.0",

package/util.js

@@ -33,4 +33,4 @@ export function getUid(obj) {
  * OpenLayers version.
  * @type {string}
  */
-export const VERSION = '10.0.1-dev.1723471742506';
+export const VERSION = '10.0.1-dev.1723624515788';

package/webgl/ShaderBuilder.d.ts

@@ -1,4 +1,4 @@
-export const COMMON_HEADER: "#ifdef GL_FRAGMENT_PRECISION_HIGH\nprecision highp float;\n#else\nprecision mediump float;\n#endif\nuniform mat4 u_projectionMatrix;\nuniform mat4 u_screenToWorldMatrix;\nuniform vec2 u_viewportSizePx;\nuniform float u_pixelRatio;\nuniform float u_globalAlpha;\nuniform float u_time;\nuniform float u_zoom;\nuniform float u_resolution;\nuniform float u_rotation;\nuniform vec4 u_renderExtent;\nuniform vec2 u_patternOrigin;\nuniform float u_depth;\nuniform mediump int u_hitDetection;\n\nconst float PI = 3.141592653589793238;\nconst float TWO_PI = 2.0 * PI;\n\n// this used to produce an alpha-premultiplied color from a texture\nvec4 samplePremultiplied(sampler2D sampler, vec2 texCoord) {\n  vec4 color = texture2D(sampler, texCoord);\n  return vec4(color.rgb * color.a, color.a);\n}\n";
+export const COMMON_HEADER: "#ifdef GL_FRAGMENT_PRECISION_HIGH\nprecision highp float;\n#else\nprecision mediump float;\n#endif\nuniform mat4 u_projectionMatrix;\nuniform mat4 u_screenToWorldMatrix;\nuniform vec2 u_viewportSizePx;\nuniform float u_pixelRatio;\nuniform float u_globalAlpha;\nuniform float u_time;\nuniform float u_zoom;\nuniform float u_resolution;\nuniform float u_rotation;\nuniform vec4 u_renderExtent;\nuniform vec2 u_patternOrigin;\nuniform float u_depth;\nuniform mediump int u_hitDetection;\n\nconst float PI = 3.141592653589793238;\nconst float TWO_PI = 2.0 * PI;\n";
 /**
  * @typedef {Object} VaryingDescription
  * @property {string} name Varying name, as will be declared in the header.
@@ -19,6 +19,10 @@ export const COMMON_HEADER: "#ifdef GL_FRAGMENT_PRECISION_HIGH\nprecision highp
  *   .setSymbolSizeExpression('...')
  *   .getSymbolFragmentShader();
  * ```
+ *
+ * A note on [alpha premultiplication](https://en.wikipedia.org/wiki/Alpha_compositing#Straight_versus_premultiplied):
+ * The ShaderBuilder class expects all colors to **not having been alpha-premultiplied!** This is because alpha
+ * premultiplication is done at the end of each fragment shader.
  */
 export class ShaderBuilder {
     /**

package/webgl/ShaderBuilder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ShaderBuilder.d.ts","sourceRoot":"","sources":["ShaderBuilder.js"],"names":[],"mappings":"AAQA,mzBA2BE;AAIF;;;;;;GAMG;AAEH;;;;;;;;;;;;;GAaG;AACH;IAEI;;;;OAIG;IACH,kBAAmB;IAEnB;;;;OAIG;IACH,oBAAqB;IAErB;;;;OAIG;IACH,kBAAmB;IAEnB;;;OAGG;IACH,mBAAuB;IAEvB;;;OAGG;IACH,8BAEkE;IAElE;;;OAGG;IACH,kCAAsC;IAEtC;;;OAGG;IACH,gCAA0C;IAE1C;;;OAGG;IACH,+BAEC;IAED;;;OAGG;IACH,4BAAqD;IAErD;;;OAGG;IACH,2BAAiC;IAEjC;;;OAGG;IACH,8BAAkC;IAElC;;;OAGG;IACH,mBAAuB;IAEvB;;;OAGG;IACH,+BAAyE;IAEzE;;;OAGG;IACH,+BAEC;IAED;;OAEG;IACH,gCAAmC;IAEnC;;OAEG;IACH,6BAAiD;IAEjD;;OAEG;IACH,8BAAkD;IAElD;;OAEG;IACH,oCAAwC;IAExC;;OAEG;IACH,uCAA8C;IAE9C;;;OAGG;IACH,iBAAqB;IAErB;;;OAGG;IACH,6BAEC;IAED;;;OAGG;IACH,+BAAgC;IAEhC;;;OAGG;IACH,iCAAkC;IAGpC;;;;;OAKG;IACH,iBAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;;;OAKG;IACH,mBAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;;;;;OAOG;IACH,iBALW,MAAM,QACN,OAAO,GAAC,MAAM,GAAC,MAAM,GAAC,MAAM,cAC5B,MAAM,GACL,aAAa,CASxB;IAED;;;;;;OAMG;IACH,oCAHW,MAAM,GACL,aAAa,CAMxB;IAED;;OAEG;IACH,2BAFY,MAAM,CAIjB;IAED;;;;;;OAMG;IACH,wCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;;;;OAMG;IACH,sCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;OAEG;IACH,6BAFY,MAAM,CAIjB;IAED;;;;;;OAMG;IACH,qCAHW,MAAM,GACL,aAAa,CAMxB;IAED;;OAEG;IACH,4BAFY,MAAM,CAIjB;IAED;;;;;;OAMG;IACH,2CAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;;;;;;OAQG;IACH,yCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;OAEG;IACH,gCAFY,MAAM,CAIjB;IAED;;;;;OAKG;IACH,wCAHW,OAAO,GACN,aAAa,CAKxB;IAED;;;OAGG;IACH,qCAHW,MAAM,GACL,aAAa,CAMxB;IAED;;;OAGG;IACH,qCAHW,MAAM,GACL,aAAa,CAMxB;IAED;;OAEG;IACH,4BAFY,MAAM,CAIjB;IAED;;;OAGG;IACH,sCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;OAGG;IACH,mCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;OAGG;IACH,oCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;OAGG;IACH,0CAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;;OAIG;IACH,6CAJW,MAAM,GAEL,aAAa,CAKxB;IAED;;;OAGG;IACH,mCAHW,MAAM,GACL,aAAa,CAMxB;IAED;;OAEG;IACH,0BAFY,MAAM,CAIjB;IAED,yCAKC;IACD,2CAKC;IAED;;;OAGG;IACH,yBAFY,MAAM,GAAC,IAAI,CA+EtB;IAED;;;OAGG;IACH,2BAFY,MAAM,GAAC,IAAI,CAqCtB;IAED;;;OAGG;IACH,yBAFY,MAAM,GAAC,IAAI,CAmHtB;IAED;;;;OAIG;IACH,2BAFY,MAAM,GAAC,IAAI,CAsJtB;IAED;;;;OAIG;IACH,uBAFY,MAAM,GAAC,IAAI,CAoCtB;IAED;;;OAGG;IACH,yBAFY,MAAM,GAAC,IAAI,CAqDtB;CACF;;;;;UAv5Ba,MAAM;;;;UACN,MAAM;;;;;gBACN,MAAM"}
+{"version":3,"file":"ShaderBuilder.d.ts","sourceRoot":"","sources":["ShaderBuilder.js"],"names":[],"mappings":"AAQA,+kBAqBE;AAIF;;;;;;GAMG;AAEH;;;;;;;;;;;;;;;;;GAiBG;AACH;IAEI;;;;OAIG;IACH,kBAAmB;IAEnB;;;;OAIG;IACH,oBAAqB;IAErB;;;;OAIG;IACH,kBAAmB;IAEnB;;;OAGG;IACH,mBAAuB;IAEvB;;;OAGG;IACH,8BAEkE;IAElE;;;OAGG;IACH,kCAAsC;IAEtC;;;OAGG;IACH,gCAA0C;IAE1C;;;OAGG;IACH,+BAEC;IAED;;;OAGG;IACH,4BAAqD;IAErD;;;OAGG;IACH,2BAAiC;IAEjC;;;OAGG;IACH,8BAAkC;IAElC;;;OAGG;IACH,mBAAuB;IAEvB;;;OAGG;IACH,+BAAyE;IAEzE;;;OAGG;IACH,+BAEC;IAED;;OAEG;IACH,gCAAmC;IAEnC;;OAEG;IACH,6BAAiD;IAEjD;;OAEG;IACH,8BAAkD;IAElD;;OAEG;IACH,oCAAwC;IAExC;;OAEG;IACH,uCAA8C;IAE9C;;;OAGG;IACH,iBAAqB;IAErB;;;OAGG;IACH,6BAEC;IAED;;;OAGG;IACH,+BAAgC;IAEhC;;;OAGG;IACH,iCAAkC;IAGpC;;;;;OAKG;IACH,iBAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;;;OAKG;IACH,mBAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;;;;;OAOG;IACH,iBALW,MAAM,QACN,OAAO,GAAC,MAAM,GAAC,MAAM,GAAC,MAAM,cAC5B,MAAM,GACL,aAAa,CASxB;IAED;;;;;;OAMG;IACH,oCAHW,MAAM,GACL,aAAa,CAMxB;IAED;;OAEG;IACH,2BAFY,MAAM,CAIjB;IAED;;;;;;OAMG;IACH,wCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;;;;OAMG;IACH,sCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;OAEG;IACH,6BAFY,MAAM,CAIjB;IAED;;;;;;OAMG;IACH,qCAHW,MAAM,GACL,aAAa,CAMxB;IAED;;OAEG;IACH,4BAFY,MAAM,CAIjB;IAED;;;;;;OAMG;IACH,2CAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;;;;;;OAQG;IACH,yCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;OAEG;IACH,gCAFY,MAAM,CAIjB;IAED;;;;;OAKG;IACH,wCAHW,OAAO,GACN,aAAa,CAKxB;IAED;;;OAGG;IACH,qCAHW,MAAM,GACL,aAAa,CAMxB;IAED;;;OAGG;IACH,qCAHW,MAAM,GACL,aAAa,CAMxB;IAED;;OAEG;IACH,4BAFY,MAAM,CAIjB;IAED;;;OAGG;IACH,sCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;OAGG;IACH,mCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;OAGG;IACH,oCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;OAGG;IACH,0CAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;;OAIG;IACH,6CAJW,MAAM,GAEL,aAAa,CAKxB;IAED;;;OAGG;IACH,mCAHW,MAAM,GACL,aAAa,CAMxB;IAED;;OAEG;IACH,0BAFY,MAAM,CAIjB;IAED,yCAKC;IACD,2CAKC;IAED;;;OAGG;IACH,yBAFY,MAAM,GAAC,IAAI,CA+EtB;IAED;;;OAGG;IACH,2BAFY,MAAM,GAAC,IAAI,CAsCtB;IAED;;;OAGG;IACH,yBAFY,MAAM,GAAC,IAAI,CAmHtB;IAED;;;;OAIG;IACH,2BAFY,MAAM,GAAC,IAAI,CAyJtB;IAED;;;;OAIG;IACH,uBAFY,MAAM,GAAC,IAAI,CAoCtB;IAED;;;OAGG;IACH,yBAFY,MAAM,GAAC,IAAI,CAuDtB;CACF;;;;;UAj6Ba,MAAM;;;;UACN,MAAM;;;;;gBACN,MAAM"}

package/webgl/ShaderBuilder.js

@@ -27,12 +27,6 @@ uniform mediump int u_hitDetection;
 
 const float PI = 3.141592653589793238;
 const float TWO_PI = 2.0 * PI;
-
-// this used to produce an alpha-premultiplied color from a texture
-vec4 samplePremultiplied(sampler2D sampler, vec2 texCoord) {
-  vec4 color = texture2D(sampler, texCoord);
-  return vec4(color.rgb * color.a, color.a);
-}
 `;
 
 const DEFAULT_STYLE = createDefaultStyle();
@@ -58,6 +52,10 @@ const DEFAULT_STYLE = createDefaultStyle();
  *   .setSymbolSizeExpression('...')
  *   .getSymbolFragmentShader();
  * ```
+ *
+ * A note on [alpha premultiplication](https://en.wikipedia.org/wiki/Alpha_compositing#Straight_versus_premultiplied):
+ * The ShaderBuilder class expects all colors to **not having been alpha-premultiplied!** This is because alpha
+ * premultiplication is done at the end of each fragment shader.
  */
 export class ShaderBuilder {
   constructor() {
@@ -580,6 +578,7 @@ void main(void) {
   float s = sin(v_angle);
   coordsPx = vec2(c * coordsPx.x - s * coordsPx.y, s * coordsPx.x + c * coordsPx.y);
   gl_FragColor = ${this.symbolColorExpression_};
+  gl_FragColor.rgb *= gl_FragColor.a;
   if (u_hitDetection > 0) {
     if (gl_FragColor.a < 0.05) { discard; };
     gl_FragColor = v_prop_hitColor;
@@ -843,7 +842,7 @@ void main(void) {
   float currentLengthPx = max(0., min(dot(segmentTangent, startToPoint), segmentLength)) + v_distanceOffsetPx; 
   float currentRadiusPx = abs(dot(segmentNormal, startToPoint));
   float currentRadiusRatio = dot(segmentNormal, startToPoint) * 2. / v_width;
-  vec4 color = ${this.strokeColorExpression_} * u_globalAlpha;
+  vec4 color = ${this.strokeColorExpression_};
   float capType = ${this.strokeCapExpression_};
   float joinType = ${this.strokeJoinExpression_};
   float segmentStartDistance = computeSegmentPointDistance(currentPoint, v_segmentStart, v_segmentEnd, v_width, v_angleStart, capType, joinType);
@@ -853,7 +852,10 @@ void main(void) {
     max(segmentStartDistance, segmentEndDistance)
   );
   distance = max(distance, ${this.strokeDistanceFieldExpression_});
-  gl_FragColor = color * smoothstep(0.5, -0.5, distance);
+  color.a *= smoothstep(0.5, -0.5, distance);
+  gl_FragColor = color;
+  gl_FragColor.a *= u_globalAlpha;
+  gl_FragColor.rgb *= gl_FragColor.a;
   if (u_hitDetection > 0) {
     if (gl_FragColor.a < 0.1) { discard; };
     gl_FragColor = v_prop_hitColor;
@@ -951,7 +953,9 @@ void main(void) {
   }
   #endif
   if (${this.discardExpression_}) { discard; }
-  gl_FragColor = ${this.fillColorExpression_} * u_globalAlpha;
+  gl_FragColor = ${this.fillColorExpression_};
+  gl_FragColor.a *= u_globalAlpha;
+  gl_FragColor.rgb *= gl_FragColor.a;
   if (u_hitDetection > 0) {
     if (gl_FragColor.a < 0.1) { discard; };
     gl_FragColor = v_prop_hitColor;

package/webgl/styleparser.js

@@ -53,11 +53,11 @@ export function packColor(color) {
 }
 
 const UNPACK_COLOR_FN = `vec4 unpackColor(vec2 packedColor) {
-  return fract(packedColor[1] / 256.0) * vec4(
+  return vec4(
     fract(floor(packedColor[0] / 256.0) / 256.0),
     fract(packedColor[0] / 256.0),
     fract(floor(packedColor[1] / 256.0) / 256.0),
-    1.0
+    fract(packedColor[1] / 256.0)
   );
 }`;
 
@@ -182,9 +182,9 @@ function getColorFromDistanceField(
     color = `mix(${strokeColor}, ${color}, ${strokeFillRatio})`;
   }
   const shapeOpacity = `(1.0 - smoothstep(-0.63, 0.58, ${distanceField}))`;
-  let result = `${color} * ${shapeOpacity}`;
+  let result = `${color} * vec4(1.0, 1.0, 1.0, ${shapeOpacity})`;
   if (opacity !== null) {
-    result = `${result} * ${opacity}`;
+    result = `${result} * vec4(1.0, 1.0, 1.0, ${opacity})`;
   }
   return result;
 }
@@ -511,11 +511,11 @@ function parseIconProperties(
 
   // OPACITY
   if ('icon-opacity' in style) {
-    color = `${color} * ${expressionToGlsl(
+    color = `${color} * vec4(1.0, 1.0, 1.0, ${expressionToGlsl(
       fragContext,
       style['icon-opacity'],
       NumberType,
-    )}`;
+    )})`;
   }
 
   // IMAGE & SIZE
@@ -529,7 +529,7 @@ function parseIconProperties(
   );
   builder
     .setSymbolColorExpression(
-      `${color} * samplePremultiplied(u_texture${textureId}, v_texCoord)`,
+      `${color} * texture2D(u_texture${textureId}, v_texCoord)`,
     )
     .setSymbolSizeExpression(sizeExpression);
 
@@ -673,7 +673,7 @@ function parseStrokeProperties(
   uCoordPx = clamp(uCoordPx, 0.5, sampleSize.x - 0.5);
   float vCoordPx = (-currentRadiusRatio * 0.5 + 0.5) * sampleSize.y;
   vec2 texCoord = (vec2(uCoordPx, vCoordPx) + textureOffset) / textureSize;
-  return samplePremultiplied(texture, texCoord);
+  return texture2D(texture, texCoord);
 }`;
     const textureName = `u_texture${textureId}`;
     let tintExpression = '1.';
@@ -832,7 +832,7 @@ function parseFillProperties(
   // also make sure that we're not sampling too close to the borders to avoid interpolation with outside pixels
   samplePos = clamp(samplePos, vec2(0.5), sampleSize - vec2(0.5));
   samplePos.y = sampleSize.y - samplePos.y; // invert y axis so that images appear upright
-  return samplePremultiplied(texture, (samplePos + textureOffset) / textureSize);
+  return texture2D(texture, (samplePos + textureOffset) / textureSize);
 }`;
     const textureName = `u_texture${textureId}`;
     let tintExpression = '1.';