Skip to content

Commit 002ce03

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

18 files changed

Lines changed: 71 additions & 85 deletions

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
* }

0 commit comments

Comments
 (0)