@jscad/regl-renderer 2.6.4 → 2.6.6

package/CHANGELOG.md

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.6.6](https://github.com/jscad/OpenJSCAD.org/compare/@jscad/regl-renderer@2.6.5...@jscad/regl-renderer@2.6.6) (2023-04-30)
+
+**Note:** Version bump only for package @jscad/regl-renderer
+
+
+
+
+
+## [2.6.5](https://github.com/jscad/OpenJSCAD.org/compare/@jscad/regl-renderer@2.6.4...@jscad/regl-renderer@2.6.5) (2023-01-09)
+
+
+### Bug Fixes
+
+* **regl-renderer:** corrected rendering of overlapping transparent solid objects ([9a66b2a](https://github.com/jscad/OpenJSCAD.org/commit/9a66b2abaccb6f047c5e4c4505218e7bbac69018))
+
+
+
+
+
 ## [2.6.4](https://github.com/jscad/OpenJSCAD.org/compare/@jscad/regl-renderer@2.6.3...@jscad/regl-renderer@2.6.4) (2022-11-26)
 
 **Note:** Version bump only for package @jscad/regl-renderer

package/dist/jscad-regl-renderer.min.js

@@ -284,7 +284,7 @@ const{flatten:flatten,toArray:toArray}=require("@jscad/array-utils"),{meshColor:
 const mat4=require("gl-mat4"),maxIndex=Math.floor(32767.5),geom2ToGeometries=(o,e)=>{let{color:t}=o;const n=e.sides;if(0===n.length)return[];"color"in e&&(t=e.color);const r=t[3]<1,s=[],l=Math.floor(n.length/maxIndex)+1,a=(o,e)=>{s.push(o,e||o)},m=[];for(let o=0;o<l;o++){const l=o*maxIndex,c=Math.min(l+maxIndex,n.length),h=[];for(let o=l;o<c;o++){const e=n[o];if(e.color){if(0===s.length&&h.length>0){const o=h.length;for(let e=0;e<o;e++)s.push(t)}a(e.color,e.endColor)}else s.length&&a(t);h.push([e[0][0],e[0][1],0]),h.push([e[1][0],e[1][1],0])}const i=h.map(o=>[0,0,-1]),f=h.map((o,e)=>e),p=e.transforms?mat4.clone(e.transforms):mat4.create();m.push({type:"2d",positions:h,normals:i,indices:f,transforms:p,color:t,colors:s,isTransparent:r})}return m};module.exports=geom2ToGeometries;
 
 },{"gl-mat4":26}],96:[function(require,module,exports){
-const vec3=require("gl-vec3"),mat4=require("gl-mat4"),maxIndex=65535,geom3ToGeometries=(o,e)=>{let{color:t,smoothLighting:n}=o;"color"in e&&(t=e.color);const r=e.polygons,l=e.transforms?mat4.clone(e.transforms):mat4.create(),s=[];let c=0;for(;c<r.length;){let o=0,e=c;for(let t=c;t<r.length&&!((o+=r[t].vertices.length)>65535);t++)e++;const n=[],i=[],a=[],p=[],m=!0;for(let o=c;o<e;o++){const e=r[o],l=e.vertices,s=calculateNormal(e),c=polygonColor(e,t),m=[];for(let o=0;o<l.length;o++){const e=l[o];n.push(e),i.push(s),p.push(c);const t=n.length-1;m.push(t)}for(let o=2;o<m.length;o++)a.push([m[0],m[o-1],m[o]])}const u={type:"3d",positions:n,normals:i,indices:a,colors:p,transforms:l,isTransparent:m};s.push(u),c=e}return s},smoothing=()=>{const o=[],e=[];let t=!0;const n=[],r=[],l=[],s=[],c=[];let i=0;for(let a=0;a<o.length;a++){const p=o[a],m=p.vertices,u=polygonColor(p,e),h=calculateNormal(p);u&&1!==u[3]&&(t=!0);const g=[];for(let o=0;o<m.length;o++){let e;const t=m[o];{const o={normal:h,position:t},l=fuzyNormalAndPositionLookup(c,o,.5);if(l)e=l.index;else{const l=c[o.position],a=[{normal:o.normal,index:i}];c[o.position]=l?c[o.position].concat(a):a,e=i,u&&s.push(u),r.push(h),n.push(t),i+=1}}g.push(e)}for(let o=2;o<g.length;o++)l.push([g[0],g[o-1],g[o]])}},polygonColor=(o,e)=>{let t=e;return o.color&&(t=o.color),t&&t.length<4&&t.push(1),t},calculateNormal=o=>{if(o.plane)return vec3.clone(o.plane);const e=o.vertices,t=vec3.create();vec3.subtract(t,e[1],e[0]);const n=vec3.create();vec3.subtract(n,e[2],e[0]);const r=vec3.create();return vec3.cross(r,t,n),vec3.normalize(r,r),r},areNormalsSimilar=(o,e,t)=>vec3.distance(o,e)<=t,fuzyNormalAndPositionLookup=(o,e,t)=>{const n=o[e.position];if(n)for(let o=0;o<n.length;o++){const r=n[o].normal;if(areNormalsSimilar(r,e.normal,t))return{tupple:{position:e.position,normal:r},index:n[o].index}}};module.exports=geom3ToGeometries;
+const vec3=require("gl-vec3"),mat4=require("gl-mat4"),maxIndex=65535,geom3ToGeometries=(o,e)=>{let{color:t,smoothLighting:n}=o;"color"in e&&(t=e.color);const r=e.polygons,l=e.transforms?mat4.clone(e.transforms):mat4.create(),s=[];let c=0;for(;c<r.length;){let o=0,e=c;for(let t=c;t<r.length&&!((o+=r[t].vertices.length)>65535);t++)e++;const n=[],i=[],a=[],p=[],m=t[3]<1;for(let o=c;o<e;o++){const e=r[o],l=e.vertices,s=calculateNormal(e),c=polygonColor(e,t),m=[];for(let o=0;o<l.length;o++){const e=l[o];n.push(e),i.push(s),p.push(c);const t=n.length-1;m.push(t)}for(let o=2;o<m.length;o++)a.push([m[0],m[o-1],m[o]])}const u={type:"3d",positions:n,normals:i,indices:a,colors:p,transforms:l,isTransparent:m};s.push(u),c=e}return s},smoothing=()=>{const o=[],e=[];let t=!0;const n=[],r=[],l=[],s=[],c=[];let i=0;for(let a=0;a<o.length;a++){const p=o[a],m=p.vertices,u=polygonColor(p,e),h=calculateNormal(p);u&&1!==u[3]&&(t=!0);const g=[];for(let o=0;o<m.length;o++){let e;const t=m[o];{const o={normal:h,position:t},l=fuzyNormalAndPositionLookup(c,o,.5);if(l)e=l.index;else{const l=c[o.position],a=[{normal:o.normal,index:i}];c[o.position]=l?c[o.position].concat(a):a,e=i,u&&s.push(u),r.push(h),n.push(t),i+=1}}g.push(e)}for(let o=2;o<g.length;o++)l.push([g[0],g[o-1],g[o]])}},polygonColor=(o,e)=>{let t=e;return o.color&&(t=o.color),t&&t.length<4&&t.push(1),t},calculateNormal=o=>{if(o.plane)return vec3.clone(o.plane);const e=o.vertices,t=vec3.create();vec3.subtract(t,e[1],e[0]);const n=vec3.create();vec3.subtract(n,e[2],e[0]);const r=vec3.create();return vec3.cross(r,t,n),vec3.normalize(r,r),r},areNormalsSimilar=(o,e,t)=>vec3.distance(o,e)<=t,fuzyNormalAndPositionLookup=(o,e,t)=>{const n=o[e.position];if(n)for(let o=0;o<n.length;o++){const r=n[o].normal;if(areNormalsSimilar(r,e.normal,t))return{tupple:{position:e.position,normal:r},index:n[o].index}}};module.exports=geom3ToGeometries;
 
 },{"gl-mat4":26,"gl-vec3":59}],97:[function(require,module,exports){
 const mat4=require("gl-mat4"),maxIndex=Math.floor(32767.5)-2,path2ToGeometries=(o,t)=>{let{color:e}=o;const s=t.points;if(0===s.length)return[];"color"in t&&(e=t.color);const n=e[3]<1,r=Math.floor(s.length/maxIndex)+1,a=[];for(let o=0;o<r;o++){const l=o*maxIndex,m=Math.min(l+maxIndex,s.length),c=[];let i;for(let o=l;o<m;o++){const t=s[o];i&&(c.push([i[0],i[1],0]),c.push([t[0],t[1],0])),i=t}if(o+1===r&&t.isClosed&&i){const o=s[0];c.push([i[0],i[1],0]),c.push([o[0],o[1],0])}const p=c.map(o=>[0,0,-1]),h=c.map((o,t)=>t),f=t.transforms?mat4.clone(t.transforms):mat4.create();a.push({type:"2d",positions:c,normals:p,indices:h,transforms:f,color:e,isTransparent:n})}return a};module.exports=path2ToGeometries;
@@ -305,7 +305,7 @@ const makeDrawMultiGrid=(e,i)=>{const{size:s,ticks:r}=Object.assign({},{size:[50
 const vColorFrag="\nprecision mediump float;\nuniform vec4 ucolor;\n\nvoid main () {\n  gl_FragColor = ucolor;\n}\n";module.exports={frag:vColorFrag};
 
 },{}],103:[function(require,module,exports){
-const mat4=require("gl-mat4"),{meshColor:meshColor}=require("../../renderDefaults"),drawLines=(e,r={})=>{const t={color:meshColor,geometry:void 0};let{geometry:o,color:s,transparent:a}=Object.assign({},t,r);"color"in o&&(s=o.color);const l=!!(o.indices&&o.indices.length>0),n=!!(o.normals&&o.normals.length>0),i=!!(o.colors&&o.colors.length>0),c={primitive:"lines",vert:i?require("./vColorShaders").vert:require("./meshShaders").vert,frag:i?require("./vColorShaders").frag:require("./colorOnlyShaders").frag,uniforms:{model:(e,r)=>r.model||o.transforms||mat4.create(),ucolor:(e,r)=>r&&r.color?r.color:s},attributes:{position:e.buffer({usage:"static",type:"float",data:o.positions})},depth:{enable:!a}};return a&&(c.blend={enable:!0,func:{src:"src alpha",dst:"one minus src alpha"}}),i&&(c.attributes.color=e.buffer({usage:"static",type:"float",data:o.colors})),l&&(c.elements=e.elements({usage:"static",type:"uint16",data:o.indices})),n&&(c.attributes.normal=e.buffer({usage:"static",type:"float",data:o.normals})),e(c)};module.exports=drawLines;
+const mat4=require("gl-mat4"),{meshColor:meshColor}=require("../../renderDefaults"),drawLines=(e,r={})=>{const o={color:meshColor,geometry:void 0};let{geometry:t,color:s,transparent:a}=Object.assign({},o,r);"color"in t&&(s=t.color);const l=!!(t.indices&&t.indices.length>0),i=!!(t.normals&&t.normals.length>0),n=!!(t.colors&&t.colors.length>0),c={primitive:"lines",vert:n?require("./vColorShaders").vert:require("./meshShaders").vert,frag:n?require("./vColorShaders").frag:require("./colorOnlyShaders").frag,uniforms:{model:(e,r)=>r.model||t.transforms||mat4.create(),ucolor:(e,r)=>r&&r.color?r.color:s},attributes:{position:e.buffer({usage:"static",type:"float",data:t.positions})}};return a&&(c.blend={enable:!0,func:{src:"src alpha",dst:"one minus src alpha"}}),n&&(c.attributes.color=e.buffer({usage:"static",type:"float",data:t.colors})),l&&(c.elements=e.elements({usage:"static",type:"uint16",data:t.indices})),i&&(c.attributes.normal=e.buffer({usage:"static",type:"float",data:t.normals})),e(c)};module.exports=drawLines;
 
 },{"../../renderDefaults":111,"./colorOnlyShaders":102,"./meshShaders":104,"./vColorShaders":105,"gl-mat4":26}],104:[function(require,module,exports){
 const meshVert="\nprecision mediump float;\n\nuniform float camNear, camFar;\nuniform mat4 model, view, projection;\n\nattribute vec3 position, normal;\n\n\nvarying vec3 surfaceNormal, surfacePosition;\nvarying vec4 _worldSpacePosition;\n\n\nvoid main() {\n\n\n  surfacePosition = position;\n  surfaceNormal = normal;\n  vec4 worldSpacePosition = model * vec4(position, 1);\n  _worldSpacePosition = worldSpacePosition;\n\n  vec4 glPosition = projection * view * model * vec4(position, 1);\n  gl_Position = glPosition;\n}\n",meshFrag="\nprecision mediump float;\nvarying vec3 surfaceNormal;\nuniform float ambientLightAmount;\nuniform float diffuseLightAmount;\nuniform vec4 ucolor;\nuniform vec3 lightDirection;\nuniform vec3 opacity;\n\nvarying vec4 _worldSpacePosition;\n\nuniform vec2 printableArea;\n\nvec4 errorColor = vec4(0.15, 0.15, 0.15, 0.3);\n\nvoid main () {\n  vec4 depth = gl_FragCoord;\n\n  float v = 0.8; // shadow value\n  vec4 endColor = ucolor;\n\n  vec3 ambient = ambientLightAmount * endColor.rgb;\n  float cosTheta = dot(surfaceNormal, lightDirection);\n  vec3 diffuse = diffuseLightAmount * endColor.rgb * clamp(cosTheta , 0.0, 1.0 );\n\n  float cosTheta2 = dot(surfaceNormal, vec3(-lightDirection.x, -lightDirection.y, lightDirection.z));\n  vec3 diffuse2 = diffuseLightAmount * endColor.rgb * clamp(cosTheta2 , 0.0, 1.0 );\n\n  gl_FragColor = vec4((ambient + diffuse + diffuse2 * v), endColor.a);\n}";module.exports={vert:meshVert,frag:meshFrag};
@@ -314,7 +314,7 @@ const meshVert="\nprecision mediump float;\n\nuniform float camNear, camFar;\nun
 const vColorVert="\nprecision mediump float;\n\nuniform float camNear, camFar;\nuniform mat4 model, view, projection;\n\nattribute vec3 position, normal;\nattribute vec4 color;\n\nvarying vec3 surfaceNormal, surfacePosition;\nvarying vec4 _worldSpacePosition;\nvarying vec4 vColor;\n\nvoid main() {\n  vColor = color;\n\n  surfacePosition = position;\n  surfaceNormal = normal;\n  vec4 worldSpacePosition = model * vec4(position, 1);\n  _worldSpacePosition = worldSpacePosition;\n\n  vec4 glPosition = projection * view * model * vec4(position, 1);\n  gl_Position = glPosition;\n}\n",vColorFrag="\nprecision mediump float;\nvarying vec4 vColor;\n\nvoid main () {\n  gl_FragColor = vColor;\n}\n";module.exports={frag:vColorFrag,vert:vColorVert};
 
 },{}],106:[function(require,module,exports){
-const mat4=require("gl-mat4"),{meshColor:meshColor}=require("../../renderDefaults"),drawMesh=(e,r={extras:{}})=>{const t={useVertexColors:!0,dynamicCulling:!0,geometry:void 0,color:meshColor},{geometry:a,dynamicCulling:s,useVertexColors:o,color:l,transparent:n}=Object.assign({},t,r),i=e.buffer([]),c=!!(a.indices&&a.indices.length>0),m=!!(a.normals&&a.normals.length>0),u=!!(o&&a.colors&&a.colors.length>0),d=a.transforms||mat4.create(),g=mat4.determinant(d)<0,f=s&&g?"front":"back",h=u?require("./vColorShaders").vert:require("./meshShaders").vert,p=u?require("./vColorShaders").frag:require("./meshShaders").frag,b=mat4.invert(mat4.create(),d);let C={primitive:"triangles",vert:h,frag:p,uniforms:{model:(e,r)=>d,ucolor:(e,r)=>r&&r.color?r.color:l,vColorToggler:(e,r)=>r&&r.useVertexColors&&!0===r.useVertexColors?1:0,unormal:(e,r)=>{const t=mat4.invert(mat4.create(),r.camera.view);return mat4.multiply(t,b,t),mat4.transpose(t,t),t}},attributes:{position:e.buffer({usage:"static",type:"float",data:a.positions}),ao:i},cull:{enable:!0,face:f},depth:{enable:!n}};return n&&(C.blend={enable:!0,func:{src:"src alpha",dst:"one minus src alpha"}}),a.cells?C.elements=a.cells:c?C.elements=e.elements({usage:"static",type:"uint16",data:a.indices}):a.triangles?C.elements=a.triangles:C.count=a.positions.length/3,m&&(C.attributes.normal=e.buffer({usage:"static",type:"float",data:a.normals})),u&&(C.attributes.color=e.buffer({usage:"static",type:"float",data:a.colors})),e(C=Object.assign({},C,r.extras))};module.exports=drawMesh;
+const mat4=require("gl-mat4"),{meshColor:meshColor}=require("../../renderDefaults"),drawMesh=(e,r={extras:{}})=>{const t={useVertexColors:!0,dynamicCulling:!0,geometry:void 0,color:meshColor,visuals:{}},{geometry:s,dynamicCulling:a,useVertexColors:o,color:l,visuals:n}=Object.assign({},t,r),i=e.buffer([]),u=!!(s.indices&&s.indices.length>0),c=!!(s.normals&&s.normals.length>0),m="transparent"in n&&n.transparent,g=!!(o&&s.colors&&s.colors.length>0),d=s.transforms||mat4.create(),f=mat4.determinant(d)<0,h=a&&f?"front":"back",p=g?require("./vColorShaders").vert:require("./meshShaders").vert,b=g?require("./vColorShaders").frag:require("./meshShaders").frag,v=mat4.invert(mat4.create(),d);let C={primitive:"triangles",vert:p,frag:b,uniforms:{model:(e,r)=>d,ucolor:(e,r)=>r&&r.color?r.color:l,vColorToggler:(e,r)=>r&&r.useVertexColors&&!0===r.useVertexColors?1:0,unormal:(e,r)=>{const t=mat4.invert(mat4.create(),r.camera.view);return mat4.multiply(t,v,t),mat4.transpose(t,t),t}},attributes:{position:e.buffer({usage:"static",type:"float",data:s.positions}),ao:i},cull:{enable:!0,face:h}};return m&&(C.blend={enable:!0,func:{src:"src alpha",dst:"one minus src alpha"}}),s.cells?C.elements=s.cells:u?C.elements=e.elements({usage:"static",type:"uint16",data:s.indices}):s.triangles?C.elements=s.triangles:C.count=s.positions.length/3,c&&(C.attributes.normal=e.buffer({usage:"static",type:"float",data:s.normals})),g&&(C.attributes.color=e.buffer({usage:"static",type:"float",data:s.colors})),e(C=Object.assign({},C,r.extras))};module.exports=drawMesh;
 
 },{"../../renderDefaults":111,"./meshShaders":107,"./vColorShaders":108,"gl-mat4":26}],107:[function(require,module,exports){
 const meshFrag="\nprecision mediump float;\nvarying vec3 surfaceNormal;\nuniform float ambientLightAmount;\nuniform float diffuseLightAmount;\nuniform vec4 ucolor;\nuniform vec3 lightDirection;\nuniform vec3 opacity;\n\nvarying vec4 _worldSpacePosition;\n\nuniform vec2 printableArea;\n\nvec4 errorColor = vec4(0.15, 0.15, 0.15, 0.3);\n\nvoid main () {\n  vec4 depth = gl_FragCoord;\n\n  float v = 0.8; // shadow value\n  vec4 endColor = ucolor;\n\n  vec3 ambient = ambientLightAmount * endColor.rgb;\n  float cosTheta = dot(surfaceNormal, lightDirection);\n  vec3 diffuse = diffuseLightAmount * endColor.rgb * clamp(cosTheta , 0.0, 1.0 );\n\n  float cosTheta2 = dot(surfaceNormal, vec3(-lightDirection.x, -lightDirection.y, lightDirection.z));\n  vec3 diffuse2 = diffuseLightAmount * endColor.rgb * clamp(cosTheta2 , 0.0, 1.0 );\n\n  gl_FragColor = vec4((ambient + diffuse + diffuse2 * v), endColor.a);\n}",meshVert="\nprecision mediump float;\n\nuniform float camNear, camFar;\nuniform mat4 model, view, projection;\n\nattribute vec3 position, normal;\n\nvarying vec3 surfaceNormal, surfacePosition;\nvarying vec4 _worldSpacePosition;\n\nvoid main() {\n  surfacePosition = position;\n  surfaceNormal = normal;\n  vec4 worldSpacePosition = model * vec4(position, 1);\n  _worldSpacePosition = worldSpacePosition;\n\n  vec4 glPosition = projection * view * model * vec4(position, 1);\n  gl_Position = glPosition;\n}\n";module.exports={vert:meshVert,frag:meshFrag};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jscad/regl-renderer",
-  "version": "2.6.4",
+  "version": "2.6.6",
   "description": "Renderer for JSCAD Geometries",
   "homepage": "https://openjscad.xyz/",
   "repository": "https://github.com/jscad/OpenJSCAD.org",
@@ -36,12 +36,12 @@
   },
   "devDependencies": {
     "@jscad/img-utils": "2.0.5",
-    "@jscad/modeling": "2.11.0",
+    "@jscad/modeling": "2.11.1",
     "ava": "3.15.0",
     "browserify": "16.5.1",
     "budo": "11.6.4",
     "nyc": "15.1.0",
     "uglifyify": "5.0.2"
   },
-  "gitHead": "5899622c5ffc640001da7261d7c06a1223064ccc"
+  "gitHead": "4313974b50957018d2edd010e3a251f59bea46a4"
 }

package/src/geometry-utils-V2/entitiesFromSolids.test.js

@@ -47,7 +47,7 @@ test('entitiesFromSolids (various solids)', (t) => {
   t.deepEqual(entities[2].visuals, {
     drawCmd: 'drawMesh',
     show: true,
-    transparent: true,
+    transparent: false,
     useVertexColors: true
   })
 })

package/src/geometry-utils-V2/geom3ToGeometries.js

@@ -38,7 +38,7 @@ const geom3ToGeometries = (options, solid) => {
     const normals = []
     const indices = []
     const colors = []
-    const isTransparent = true
+    const isTransparent = (color[3] < 1.0)
 
     for (let i = setstart; i < setend; i++) {
       const polygon = polygons[i]

package/src/geometry-utils-V2/geom3ToGeometries.test.js

@@ -43,7 +43,7 @@ test('geom3ToGeometries (solid with polygons)', (t) => {
       [1, 2, 3, 4], [1, 2, 3, 4], [1, 2, 3, 4], [1, 2, 3, 4],
       [1, 2, 3, 4], [1, 2, 3, 4], [1, 2, 3, 4], [1, 2, 3, 4]
     ],
-    isTransparent: true,
+    isTransparent: false,
     transforms: defaultTransforms,
     indices: [
       [0, 1, 2], [0, 2, 3],
@@ -88,7 +88,7 @@ test('geom3ToGeometries (solid with polygons)', (t) => {
 
   // with color
   solid.color = [0, 0, 1, 1]
-  expected[0].isTransparent = true
+  expected[0].isTransparent = false
   expected[0].colors = [
     [0, 0, 1, 1], [0, 0, 1, 1], [0, 0, 1, 1], [0, 0, 1, 1],
     [0, 0, 1, 1], [0, 0, 1, 1], [0, 0, 1, 1], [0, 0, 1, 1],

package/src/rendering/commands/drawLines/index.js

@@ -29,8 +29,7 @@ const drawLines = (regl, params = {}) => {
     },
     attributes: {
       position: regl.buffer({ usage: 'static', type: 'float', data: geometry.positions })
-    },
-    depth: { enable: !transparent }
+    }
   }
 
   // blending is a bit tricky

package/src/rendering/commands/drawMesh/index.js

@@ -7,16 +7,17 @@ const drawMesh = (regl, params = { extras: {} }) => {
     useVertexColors: true,
     dynamicCulling: true,
     geometry: undefined,
-    color: meshColor
+    color: meshColor,
+    visuals: {}
   }
-  const { geometry, dynamicCulling, useVertexColors, color, transparent } = Object.assign({}, defaults, params)
-
+  const { geometry, dynamicCulling, useVertexColors, color, visuals } = Object.assign({}, defaults, params)
   // let ambientOcclusion = vao(geometry.indices, geometry.positions, 64, 64)
   const ambientOcclusion = regl.buffer([])
 
   // vertex colors or not ?
   const hasIndices = !!(geometry.indices && geometry.indices.length > 0)
   const hasNormals = !!(geometry.normals && geometry.normals.length > 0)
+  const transparent = 'transparent' in visuals ? visuals.transparent : false
   const hasVertexColors = !!(useVertexColors && geometry.colors && geometry.colors.length > 0)
   const transforms = geometry.transforms || mat4.create()
   const flip = mat4.determinant(transforms) < 0
@@ -53,8 +54,7 @@ const drawMesh = (regl, params = { extras: {} }) => {
     cull: {
       enable: true,
       face: cullFace
-    },
-    depth: { enable: !transparent }
+    }
   }
 
   // blending is a bit tricky