Issue #805

Labels now have show/hide methods.
3dmol · Aug 31, 2024 · cc817a8 · cc817a8
1 parent b5da96a
commit cc817a8
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 2 deletions.
diff --git a/src/Label.ts b/src/Label.ts
@@ -4,6 +4,7 @@ import {
   SpriteMaterial,
   Sprite,
   Vector2,
+  Material,
 } from "./WebGL";
 import { Gradient } from "./Gradient";
 import { Color, CC, ColorSpec } from "./colors";
@@ -101,7 +102,7 @@ export class Label {
   stylespec: any;
   canvas: HTMLCanvasElement;
   context: any;
-  sprite: any;
+  sprite: Sprite;
   text: any;
   frame: any;
   constructor(text: string, parameters: LabelSpec) {
@@ -122,6 +123,15 @@ export class Label {
     return this.stylespec;
   }
 
+  hide() {
+    this.sprite.visible = false;
+  }
+
+  show() {
+
+    this.sprite.visible = true;
+  }
+
   setContext() {
     var style = this.stylespec;
     var useScreen =
@@ -305,7 +315,7 @@ export class Label {
       alignment: spriteAlignment,
       depthTest: !inFront,
       screenOffset: style.screenOffset || null,
-    });
+    }) as Material;
 
     this.sprite.scale.set(1, 1, 1);
 

diff --git a/src/WebGL/objects/Sprite.ts b/src/WebGL/objects/Sprite.ts
@@ -9,6 +9,7 @@ export class Sprite extends Object3D {
   _modelViewMatrix: any;
   z?: number;
   material?: Material;
+  hidden = false;
 
   constructor(material = new SpriteMaterial() as Material) {
     super();

diff --git a/tests/auto/tests/hidelabel.js b/tests/auto/tests/hidelabel.js
@@ -0,0 +1,11 @@
+
+
+let l = viewer.addLabel("Hello World",{position:{x:0,y:0,z:0},useScreen: true, fontSize: 64});
+let l2 = viewer.addLabel("Hello World",{position:{x:10,y:0,z:0},backgroundColor: "blue",useScreen: true, fontSize: 64});
+let l3 = viewer.addLabel("Hello World",{position:{x:10,y:100,z:0},backgroundColor: "yellow",useScreen: true, fontSize: 64});
+
+l.hide();
+l3.hide();
+viewer.render( );
+l3.show();
+viewer.render();
diff --git a/tests/glcheck/reference-images/tests-glcheck-render-tests-hidelabel.html.png b/tests/glcheck/reference-images/tests-glcheck-render-tests-hidelabel.html.png