Skip to content

Commit 002ce03

Browse files
mrdoobmrdoob
committed
Reverted to material.premultipliedAlpha approach. See mrdoob#8276.
1 parent 546c91c commit 002ce03

18 files changed

+71
-85
lines changed

‎examples/webgl_materials_transparency.html

Lines changed: 7 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -54,9 +54,8 @@
5454

5555
var container, stats;
5656
var params = {
57-
opacity: 0.2,
5857
roughness: 1.0,
59-
bumpScale: 0.3
58+
opacity: 0.5
6059
};
6160
var camera, scene, renderer, controls, objects = [];
6261
var composer;
@@ -79,29 +78,25 @@
7978

8079
standardMaterial = new THREE.MeshStandardMaterial( {
8180
map: null,
82-
bumpScale: - 0.05,
83-
color: 0x0304ff,
8481
metalness: 0.9,
85-
roughness: 0.5,
82+
roughness: 1.0,
8683
shading: THREE.SmoothShading,
8784
blending: THREE.NormalBlending,
8885
transparent: true
8986
} );
9087
var geometry = new THREE.SphereGeometry( 18, 30, 30 );
9188
var torusMesh1 = new THREE.Mesh( geometry, standardMaterial );
92-
torusMesh1.position.x = 20.0;
89+
torusMesh1.position.x = - 20.0;
9390
torusMesh1.castShadow = true;
9491
scene.add( torusMesh1 );
9592
objects.push( torusMesh1 );
9693

9794
standardMaterialPremultiplied = new THREE.MeshStandardMaterial( {
9895
map: null,
99-
bumpScale: - 0.05,
100-
color: 0x0304ff,
10196
metalness: 0.9,
102-
roughness: 0.5,
97+
roughness: 1.0,
10398
shading: THREE.SmoothShading,
104-
blending: THREE.PremultipliedAlphaNormalBlending,
99+
premultipliedAlpha: true,
105100
transparent: true
106101
} );
107102

@@ -114,17 +109,15 @@
114109
map.repeat.set( 2, 2 );
115110
standardMaterial.map = map;
116111
standardMaterial.roughnessMap = map;
117-
//standardMaterial.bumpMap = map;
118112
standardMaterial.needsUpdate = true;
119113
standardMaterialPremultiplied.map = map;
120114
standardMaterialPremultiplied.roughnessMap = map;
121-
//standardMaterialPremultiplied.bumpMap = map;
122115
standardMaterialPremultiplied.needsUpdate = true;
123116

124117
} );
125118

126119
var torusMesh2 = new THREE.Mesh( geometry, standardMaterialPremultiplied );
127-
torusMesh2.position.x = - 20.0;
120+
torusMesh2.position.x = 20.0;
128121
torusMesh2.castShadow = true;
129122
scene.add( torusMesh2 );
130123
objects.push( torusMesh2 );
@@ -152,7 +145,7 @@
152145
var spotLight = new THREE.SpotLight( 0xffffff );
153146
spotLight.position.set( 50, 100, 50 );
154147
spotLight.angle = Math.PI / 7;
155-
spotLight.penumbra = 0.8
148+
spotLight.penumbra = 0.8;
156149
spotLight.intensity = 5;
157150
spotLight.castShadow = true;
158151
scene.add( spotLight );
@@ -190,7 +183,6 @@
190183
var gui = new dat.GUI();
191184

192185
gui.add( params, 'roughness', 0, 1 );
193-
gui.add( params, 'bumpScale', - 1, 1 );
194186
gui.add( params, 'opacity', 0, 1 );
195187
gui.open();
196188

@@ -229,9 +221,6 @@
229221
standardMaterial.roughness = params.roughness;
230222
standardMaterialPremultiplied.roughness = params.roughness;
231223

232-
standardMaterial.bumpScale = - 0.05 * params.bumpScale;
233-
standardMaterialPremultiplied.bumpScale = - 0.05 * params.bumpScale;
234-
235224
standardMaterial.opacity = params.opacity;
236225
standardMaterialPremultiplied.opacity = params.opacity;
237226

‎examples/webgl_tonemapping.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -105,8 +105,8 @@
105105
metalness: 0.9,
106106
roughness: 0.8,
107107
shading: THREE.SmoothShading,
108-
transparent: true,
109-
blending: THREE.PremultipliedAlphaNormalBlending
108+
premultipliedAlpha: true,
109+
transparent: true
110110
} );
111111

112112
var textureLoader = new THREE.TextureLoader();

‎src/Three.js

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -156,11 +156,6 @@ THREE.AdditiveBlending = 2;
156156
THREE.SubtractiveBlending = 3;
157157
THREE.MultiplyBlending = 4;
158158
THREE.CustomBlending = 5;
159-
THREE.PremultipliedAlphaNormalBlending = 6;
160-
THREE.PremultipliedAlphaAdditiveBlending = 7;
161-
THREE.PremultipliedAlphaSubtractiveBlending = 8;
162-
THREE.PremultipliedAlphaMultiplyBlending = 9;
163-
THREE.PremultipliedAlphaCustomBlending = 10;
164159

165160
// custom blending equations
166161
// (numbers start from 100 not to clash with other

‎src/materials/LineBasicMaterial.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
* linecap: "round",
1111
* linejoin: "round",
1212
*
13-
* blending: THREE.PremultipliedAlphaNormalBlending,
13+
* blending: THREE.NormalBlending,
1414
* depthTest: <bool>,
1515
* depthWrite: <bool>,
1616
*
@@ -32,7 +32,7 @@ THREE.LineBasicMaterial = function ( parameters ) {
3232
this.linecap = 'round';
3333
this.linejoin = 'round';
3434

35-
this.blending = THREE.PremultipliedAlphaNormalBlending;
35+
this.blending = THREE.NormalBlending;
3636

3737
this.vertexColors = THREE.NoColors;
3838

‎src/materials/LineDashedMaterial.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
* dashSize: <float>,
1212
* gapSize: <float>,
1313
*
14-
* blending: THREE.PremultipliedAlphaNormalBlending,
14+
* blending: THREE.NormalBlending,
1515
* depthTest: <bool>,
1616
* depthWrite: <bool>,
1717
*
@@ -35,7 +35,7 @@ THREE.LineDashedMaterial = function ( parameters ) {
3535
this.dashSize = 3;
3636
this.gapSize = 1;
3737

38-
this.blending = THREE.PremultipliedAlphaNormalBlending;
38+
this.blending = THREE.NormalBlending;
3939

4040
this.vertexColors = THREE.NoColors;
4141

‎src/materials/Material.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ THREE.Material = function () {
3939
this.polygonOffsetUnits = 0;
4040

4141
this.alphaTest = 0;
42+
this.premultipliedAlpha = false;
4243

4344
this.overdraw = 0; // Overdrawn pixels (typically between 0 and 1) for fixing antialiasing gaps in CanvasRenderer
4445

@@ -194,6 +195,7 @@ THREE.Material.prototype = {
194195
if ( this.opacity < 1 ) data.opacity = this.opacity;
195196
if ( this.transparent === true ) data.transparent = this.transparent;
196197
if ( this.alphaTest > 0 ) data.alphaTest = this.alphaTest;
198+
if ( this.premultipliedAlpha === true ) data.premultipliedAlpha = this.premultipliedAlpha;
197199
if ( this.wireframe === true ) data.wireframe = this.wireframe;
198200
if ( this.wireframeLinewidth > 1 ) data.wireframeLinewidth = this.wireframeLinewidth;
199201

@@ -267,6 +269,8 @@ THREE.Material.prototype = {
267269

268270
this.alphaTest = source.alphaTest;
269271

272+
this.premultipliedAlpha = source.premultipliedAlpha;
273+
270274
this.overdraw = source.overdraw;
271275

272276
this.visible = source.visible;

‎src/materials/MeshBasicMaterial.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
* refractionRatio: <float>,
2121
*
2222
* shading: THREE.SmoothShading,
23-
* blending: THREE.PremultipliedAlphaNormalBlending,
23+
* blending: THREE.NormalBlending,
2424
* depthTest: <bool>,
2525
* depthWrite: <bool>,
2626
*
@@ -61,7 +61,7 @@ THREE.MeshBasicMaterial = function ( parameters ) {
6161
this.fog = true;
6262

6363
this.shading = THREE.SmoothShading;
64-
this.blending = THREE.PremultipliedAlphaNormalBlending;
64+
this.blending = THREE.NormalBlending;
6565

6666
this.wireframe = false;
6767
this.wireframeLinewidth = 1;

‎src/materials/MeshDepthMaterial.js

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,6 @@
55
* parameters = {
66
* opacity: <float>,
77
*
8-
* blending: THREE.NormalBlending,
9-
* depthTest: <bool>,
10-
* depthWrite: <bool>,
11-
*
128
* wireframe: <boolean>,
139
* wireframeLinewidth: <float>
1410
* }

‎src/materials/MeshLambertMaterial.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
* reflectivity: <float>,
2828
* refractionRatio: <float>,
2929
*
30-
* blending: THREE.PremultipliedAlphaNormalBlending,
30+
* blending: THREE.NormalBlending,
3131
* depthTest: <bool>,
3232
* depthWrite: <bool>,
3333
*
@@ -75,7 +75,7 @@ THREE.MeshLambertMaterial = function ( parameters ) {
7575

7676
this.fog = true;
7777

78-
this.blending = THREE.PremultipliedAlphaNormalBlending;
78+
this.blending = THREE.NormalBlending;
7979

8080
this.wireframe = false;
8181
this.wireframeLinewidth = 1;

‎src/materials/MeshNormalMaterial.js

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,6 @@
44
* parameters = {
55
* opacity: <float>,
66
*
7-
* blending: THREE.NormalBlending,
8-
* depthTest: <bool>,
9-
* depthWrite: <bool>,
10-
*
117
* wireframe: <boolean>,
128
* wireframeLinewidth: <float>
139
* }

‎src/materials/MeshPhongMaterial.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@
4040
* refractionRatio: <float>,
4141
*
4242
* shading: THREE.SmoothShading,
43-
* blending: THREE.PremultipliedAlphaNormalBlending,
43+
* blending: THREE.NormalBlending,
4444
* depthTest: <bool>,
4545
* depthWrite: <bool>,
4646
*
@@ -101,7 +101,7 @@ THREE.MeshPhongMaterial = function ( parameters ) {
101101
this.fog = true;
102102

103103
this.shading = THREE.SmoothShading;
104-
this.blending = THREE.PremultipliedAlphaNormalBlending;
104+
this.blending = THREE.NormalBlending;
105105

106106
this.wireframe = false;
107107
this.wireframeLinewidth = 1;

‎src/materials/MeshStandardMaterial.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@
4141
* refractionRatio: <float>,
4242
*
4343
* shading: THREE.SmoothShading,
44-
* blending: THREE.PremultipliedAlphaNormalBlending,
44+
* blending: THREE.NormalBlending,
4545
* depthTest: <bool>,
4646
* depthWrite: <bool>,
4747
*
@@ -104,7 +104,7 @@ THREE.MeshStandardMaterial = function ( parameters ) {
104104
this.fog = true;
105105

106106
this.shading = THREE.SmoothShading;
107-
this.blending = THREE.PremultipliedAlphaNormalBlending;
107+
this.blending = THREE.NormalBlending;
108108

109109
this.wireframe = false;
110110
this.wireframeLinewidth = 1;

‎src/materials/PointsMaterial.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
* size: <float>,
1111
* sizeAttenuation: <bool>,
1212
*
13-
* blending: THREE.PremultipliedAlphaNormalBlending,
13+
* blending: THREE.NormalBlending,
1414
* depthTest: <bool>,
1515
* depthWrite: <bool>,
1616
*
@@ -33,7 +33,7 @@ THREE.PointsMaterial = function ( parameters ) {
3333
this.size = 1;
3434
this.sizeAttenuation = true;
3535

36-
this.blending = THREE.PremultipliedAlphaNormalBlending;
36+
this.blending = THREE.NormalBlending;
3737

3838
this.vertexColors = THREE.NoColors;
3939

‎src/materials/ShaderMaterial.js

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,6 @@
99
* vertexShader: <string>,
1010
*
1111
* shading: THREE.SmoothShading,
12-
* blending: THREE.NormalBlending,
13-
* depthTest: <bool>,
14-
* depthWrite: <bool>,
1512
*
1613
* wireframe: <boolean>,
1714
* wireframeLinewidth: <float>,

‎src/materials/SpriteMaterial.js

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,6 @@
66
* opacity: <float>,
77
* map: new THREE.Texture( <Image> ),
88
*
9-
* blending: THREE.NormalBlending,
10-
* depthTest: <bool>,
11-
* depthWrite: <bool>,
12-
*
139
* uvOffset: new THREE.Vector2(),
1410
* uvScale: new THREE.Vector2(),
1511
*

‎src/renderers/WebGLRenderer.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1590,7 +1590,7 @@ THREE.WebGLRenderer = function ( parameters ) {
15901590

15911591
if ( material.transparent === true ) {
15921592

1593-
state.setBlending( material.blending, material.blendEquation, material.blendSrc, material.blendDst, material.blendEquationAlpha, material.blendSrcAlpha, material.blendDstAlpha );
1593+
state.setBlending( material.blending, material.blendEquation, material.blendSrc, material.blendDst, material.blendEquationAlpha, material.blendSrcAlpha, material.blendDstAlpha, material.premultipliedAlpha );
15941594

15951595
} else {
15961596

‎src/renderers/webgl/WebGLPrograms.js

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -178,9 +178,8 @@ THREE.WebGLPrograms = function ( renderer, capabilities ) {
178178
toneMapping: renderer.toneMapping,
179179
physicallyCorrectLights: renderer.physicallyCorrectLights,
180180

181-
premultipliedAlpha: ( material.blending === THREE.PremultipliedAlphaNormalBlending ) || ( material.blending === THREE.PremultipliedAlphaAdditiveBlending ) ||
182-
( material.blending === THREE.PremultipliedAlphaSubtractiveBlending ) || ( material.blending === THREE.PremultipliedAlphaMultiplyBlending ) || ( material.blending === THREE.PremultipliedAlphaCustomBlending ),
183-
181+
premultipliedAlpha: material.premultipliedAlpha,
182+
184183
alphaTest: material.alphaTest,
185184
doubleSided: material.side === THREE.DoubleSide,
186185
flipSided: material.side === THREE.BackSide

0 commit comments

Comments
 (0)