question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Setting Material.blending to "CustomBlending" no longer works blends as expected

See original GitHub issue

Describe the bug

As of r137 using “CustomBlending” does not work as expected.

To Reproduce

Create a material that uses “CustomBlending” and a partial opacity. In r136 it is rendered as partially transparent while in r137 it is not.

Code

const material = new THREE.MeshBasicMaterial( {
  blending: CustomBlending,
  opacity: 0.5
} );

Live example

Expected behavior

When using custom blending it renders as partially transparent as it did in r136.

Screenshots

From the js fiddle above. Left is a regular transparent cube. Right is using CustomBlending.

r136 r137
image image

Platform:

  • Device: Desktop
  • OS: MacOS
  • Browser: Chrome
  • Three.js version: r137.5

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:19 (8 by maintainers)

github_iconTop GitHub Comments

2reactions
mrdoobcommented, Feb 2, 2022

Basically, apparently many systems do not create a webgl context with alpha: false so the browser has to emulate it.

My main laptop (Intel MacBook Pro 2016) is one of the worst cases apparently, so I’ve been dealing with subpar performance and noisy fans for years… Now it feels like a brand new laptop 😬

2reactions
WestLangleycommented, Feb 2, 2022

Hmmm… I would have expected the default values for CustomBlending match the values that produce NormalBlending. At least doing so would have been a reasonable default.

It did previously…

Well, if that were the case, then you would have had no reason to use the default CustomBlending because it would have been the same as NormalBlending. Right?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Quixel Mixer: Material Blending Workflow - YouTube
In this tutorial, Josh Powers goes through the basics of scan blending with Quixel Mixer, by showing you how to create a very...
Read more >
Dynamic Proximity Blending in Blender - YouTube
Learn how to set up dynamic proximity blending materials in Blender 2.90. Works in both Eevee and Cycles!00:00 - Introduction02:35 - Tutorial ...
Read more >
can't upgrade materials/textures - Unity Forum
Mystery_01 material was not upgraded. There's no upgrader to convert Legacy Shaders/Particles/Alpha Blended shader to selected pipeline
Read more >
Blending - LearnOpenGL
Blending in OpenGL is commonly known as the technique to implement transparency within objects. Transparency is all about objects (or parts of them)...
Read more >
Material#blending – three.js docs
# .alphaTest : Float. Sets the alpha value to be used when running an alpha test. The material will not be rendered if...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found