zincjs 2.4.1-beta.0 → 2.4.1-beta.2

package/package.json

@@ -1,9 +1,12 @@
 {
   "name": "zincjs",
-  "version": "2.4.1-beta.0",
+  "version": "2.4.1-beta.2",
   "description": "ZincJS (Web-based-Zinc-Visualisation)",
   "type": "module",
   "main": "build/zinc.js",
+  "engines": {
+    "node": "^24.20.0"
+  },
   "directories": {
     "doc": "docs"
   },
@@ -45,9 +48,6 @@
     "url": "https://github.com/alan-wu/ZincJS/issues"
   },
   "homepage": "http://alan-wu.github.io/ZincJS/",
-  "engines": {
-    "node": "24.20.0"
-  },
   "allowScripts": {
     "msw@2.14.6": true
   },

package/src/loaders/JSONLoader.js

@@ -490,6 +490,24 @@ Object.assign( JSONLoader.prototype, {
 
 				geometry.morphAttributes.color = morphColorAttributes;
 
+				//Support cases where only morphColorAttributes is available
+        //without morphPositionAttributes
+				if ( geometry.morphAttributes.position === undefined ) {
+
+					const basePosition = geometry.getAttribute( 'position' );
+
+					geometry.morphAttributes.position = morphColorAttributes.map( ( colorAttribute ) => {
+
+						const positionAttribute = new BufferAttribute( basePosition.array, basePosition.itemSize );
+
+						positionAttribute.name = colorAttribute.name;
+
+						return positionAttribute;
+
+					} );
+
+				}
+
 			}
 
 			geometry.computeBoundingBox();

package/src/primitives/label.js

@@ -28,6 +28,10 @@ const Label = function (textIn, colourIn) {
   sprite.fontFace = "Asap";
   sprite.fontSize = 90;
   sprite.fontWeight = fontWeight;
+  const canvasTexture = sprite.material.map; // Snag the canvas texture generated by the library
+  sprite.material = new THREE.SpriteNodeMaterial({
+    map: canvasTexture,
+  });
   sprite.material.map.generateMipmaps = true;
   sprite.material.map.anisotropy = 4;
   sprite.material.minFilter = THREE.LinearMipmapLinearFilter; // Smooth downscaling

package/src/renderer.js

@@ -23,7 +23,7 @@ const Renderer = function (containerIn) {
 	let currentScene = undefined;
 
 	//myGezincGeometriestains a tuple of the threejs mesh, timeEnabled, morphColour flag, unique id and morph
-	const clock = new THREE.Clock(false);
+	const clock = new THREE.Timer();
 	this.playAnimation = true;
   /* default animation update rate, rate is 1000 and duration
     is default to 6000, 6s to finish a full animation */
@@ -131,7 +131,22 @@ const Renderer = function (containerIn) {
 				container = undefined;
 				canvas = parameters["canvas"];
 			}
-      //parameters["forceWebGL"] = true;
+      //WebGPURenderer otherwise requests a device with the default
+      //maxTextureArrayLayers (256 on many adapters), which is too low for
+      //some currnetly sypported scaffold. We will request the highest possible
+      //on the device
+      if (parameters.device === undefined && parameters.requiredLimits === undefined &&
+        typeof navigator !== 'undefined' && navigator.gpu) {
+        try {
+          const adapter = await navigator.gpu.requestAdapter({ powerPreference: parameters.powerPreference });
+          if (adapter) {
+            parameters.requiredLimits = { maxTextureArrayLayers: adapter.limits.maxTextureArrayLayers };
+          }
+        } catch (err) {
+          //Fall through and let WebGPURenderer's own adapter/device request
+          //use its defaults.
+        }
+      }
 			renderer = new THREE.WebGPURenderer(parameters);
       await renderer.init();
 
@@ -345,7 +360,6 @@ const Renderer = function (containerIn) {
 	 */
 	this.stopAnimate = () => {
     if (isRendering) {
-      clock.stop();
       isRendering = false;
     }
 	}
@@ -355,7 +369,7 @@ const Renderer = function (containerIn) {
 	 */
 	this.animate = () => {
     if (!isRendering) {
-      clock.start();
+      clock.reset();
       isRendering = true;
       runAnimation();
     }
@@ -553,6 +567,7 @@ const Renderer = function (containerIn) {
 					sensor = new ResizeSensor(canvas, this.onWindowResize);
 			}
 		}
+    clock.update();
 		const delta = clock.getDelta();
 		currentScene.renderGeometries(playRate, delta, this.playAnimation);
 	    for(let i = 0; i < additionalActiveScenes.length; i++) {

package/src/utilities.js

@@ -712,6 +712,10 @@ function createNewSpriteText(text, height, colour, font, pixel, weight) {
   sprite.fontFace = font;
   sprite.fontSize = pixel;
   sprite.fontWeight = weight;
+  const canvasTexture = sprite.material.map; // Snag the canvas texture generated by the library
+  sprite.material = new THREE.SpriteNodeMaterial({
+    map: canvasTexture,
+  });
   sprite.material.map.generateMipmaps = true;
   sprite.material.map.anisotropy = 4;
   sprite.material.sizeAttenuation = false;