fix: fix outline display in WebGL2

fix #85
virtual-cast · Jun 1, 2022 · e9b4b3c · e9b4b3c
1 parent f9007b1
commit e9b4b3c
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 4 deletions.
diff --git a/src/mtoon-material.ts b/src/mtoon-material.ts
@@ -750,6 +750,13 @@ export class MToonMaterial extends PushMaterial {
         }
         this._markAllSubMeshesAsMiscDirty();
     }
+    private isOutline: number = 0.0;
+    public enableOutlineRender(): void {
+        this.isOutline = 1.0;
+    }
+    public disaableOutlineRender(): void {
+        this.isOutline = 0.0;
+    }
     @expandToProperty('_markAllSubMeshesAsMiscDirty')
     public outlineColorMode: OutlineColorMode = OutlineColorMode.MixedLighting;
     private _cullMode: CullMode = CullMode.Back;
@@ -1553,7 +1560,7 @@ export class MToonMaterial extends PushMaterial {
 
             // MToon bindings
             ubo.updateFloat('aspect', scene.getEngine().getAspectRatio(scene.activeCamera!));
-            ubo.updateFloat('isOutline', 0.0);
+            ubo.updateFloat('isOutline', this.isOutline);
 
             // this variable is compatible with [Unity's _Time](https://docs.unity3d.com/Manual/SL-UnityShaderVariables.html)
             const t = window.performance.now() / 1000;

diff --git a/src/mtoon-outline-renderer.ts b/src/mtoon-outline-renderer.ts
@@ -143,10 +143,11 @@ export class MToonOutlineRenderer implements ISceneComponent {
             this.isHardwareInstancedRendering(subMesh, batch),
             (isInstance: boolean, world: Matrix, effectiveMaterial?: Material) => {
                 if (effectiveMaterial) {
-                    effectiveMaterial.bindForSubMesh(world, effectiveMesh as Mesh, subMesh);
+                    const m = effectiveMaterial as MToonMaterial;
+                    m.enableOutlineRender();
+                    m.bindForSubMesh(world, effectiveMesh as Mesh, subMesh);
+                    m.disaableOutlineRender();
                 }
-                effect.setMatrix('world', world);
-                effect.setFloat('isOutline', 1.0);
             },
             this.material,
         );