@fusefactory/fuse-three-forcegraph 1.0.6 → 1.0.8

package/dist/index.d.mts

@@ -74,10 +74,12 @@ declare class CameraController {
   camera: THREE.PerspectiveCamera;
   controls: CameraControls;
   private sceneBounds;
+  private domElement;
   private autorotateEnabled;
   private autorotateSpeed;
   private userIsActive;
   constructor(domelement: HTMLElement, config?: CameraConfig);
+  private handleWheel;
   private setupDefaultControls;
   /**
        * Set camera control mode

package/dist/index.mjs

@@ -927,15 +927,30 @@ var CameraController = class {
 	camera;
 	controls;
 	sceneBounds = null;
+	domElement;
 	autorotateEnabled = false;
 	autorotateSpeed = .5;
 	userIsActive = true;
 	constructor(domelement, config) {
+		this.domElement = domelement;
 		this.camera = new THREE.PerspectiveCamera(config?.fov ?? 50, config?.aspect ?? window.innerWidth / window.innerHeight, config?.near ?? 1e-5, config?.far ?? 1e4);
 		if (config?.position) this.camera.position.copy(config.position);
 		else this.camera.position.set(0, 0, 2);
 		this.controls = new CameraControls(this.camera, domelement);
 		this.setupDefaultControls(config);
+		this.handleWheel = this.handleWheel.bind(this);
+		domelement.addEventListener("wheel", this.handleWheel, {
+			capture: true,
+			passive: true
+		});
+	}
+	handleWheel() {
+		if (!this.controls.dollyToCursor) return;
+		const c = this.controls;
+		if (c._spherical && c._sphericalEnd) {
+			c._spherical.theta = c._sphericalEnd.theta;
+			c._spherical.phi = c._sphericalEnd.phi;
+		}
 	}
 	setupDefaultControls(config) {
 		this.controls.smoothTime = .8;
@@ -1014,6 +1029,7 @@ var CameraController = class {
 	* Animate camera to look at a specific target from a specific position
 	*/
 	async setLookAt(position, target, enableTransition = true) {
+		this.controls.normalizeRotations();
 		await this.controls.setLookAt(position.x, position.y, position.z, target.x, target.y, target.z, enableTransition);
 	}
 	/**
@@ -1043,6 +1059,7 @@ var CameraController = class {
 	* Dispose camera manager and clean up
 	*/
 	dispose() {
+		this.domElement.removeEventListener("wheel", this.handleWheel, { capture: true });
 		this.controls.dispose();
 	}
 	/**
@@ -2290,10 +2307,7 @@ var NodesRenderer = class {
 		const radii = new Float32Array(totalTexels);
 		const colors = new Float32Array(totalTexels * 4);
 		const fovRadians = 75 * Math.PI / 180;
-		const viewHeightAtDistance1 = 2 * Math.tan(fovRadians / 2);
-		const REFERENCE_HEIGHT = 1080;
-		const REFERENCE_DPR = 1;
-		const pixelToWorldRatio = viewHeightAtDistance1 / REFERENCE_HEIGHT;
+		const pixelToWorldRatio = 2 * Math.tan(fovRadians / 2) / this.renderer.getDrawingBufferSize(new THREE.Vector2()).y;
 		nodes.forEach((node, i) => {
 			const style = styleRegistry.getNodeStyle(node.category);
 			colorBuffer[i * 3] = style.color.r;
@@ -2305,7 +2319,7 @@ var NodesRenderer = class {
 			pointIndices[i * 2] = x;
 			pointIndices[i * 2 + 1] = y;
 			alphaIndex[i] = i;
-			radii[i] = style.size * REFERENCE_DPR * pixelToWorldRatio / 2;
+			radii[i] = style.size * window.devicePixelRatio * pixelToWorldRatio / 2;
 			colors[i * 4] = style.color.r;
 			colors[i * 4 + 1] = style.color.g;
 			colors[i * 4 + 2] = style.color.b;
@@ -3284,6 +3298,7 @@ var ForceSimulation = class {
 			alphaDecay: .01,
 			deltaTime: .016,
 			spaceSize: 1e3,
+			maxVelocity: 10,
 			is3D: true
 		};
 		this.velocityCarryPass = new VelocityCarryPass();
@@ -3407,6 +3422,7 @@ var ForceSimulation = class {
 	*/
 	fixedStep() {
 		const context = this.createContext();
+		this.simulationBuffers.swapVelocities();
 		const currentVelocityTarget = this.simulationBuffers.getCurrentVelocityTarget();
 		if (currentVelocityTarget) {
 			this.renderer.setRenderTarget(currentVelocityTarget);
@@ -4246,6 +4262,7 @@ var Engine = class {
 			Object.assign(this.forceSimulation.config, preset.force);
 			this.forceSimulation.reheat();
 		}
+		this.graphScene.camera.controls.normalizeRotations();
 		if (preset.camera) {
 			const { position, target, zoom, transitionDuration, mode, minDistance, maxDistance, boundary } = preset.camera;
 			if (mode) this.graphScene.camera.setMode(mode);
@@ -4257,7 +4274,7 @@ var Engine = class {
 			if (boundary) {
 				const box = new THREE.Box3(new THREE.Vector3(boundary.min.x, boundary.min.y, boundary.min.z), new THREE.Vector3(boundary.max.x, boundary.max.y, boundary.max.z));
 				this.graphScene.camera.setBoundary(box);
-			} else if (boundary === null) this.graphScene.camera.setBoundary(null);
+			}
 			if (position && target) {
 				const posVec = new THREE.Vector3(position.x, position.y, position.z);
 				const targetVec = new THREE.Vector3(target.x, target.y, target.z);
@@ -4274,10 +4291,6 @@ var Engine = class {
 				this.forceSimulation.reheat();
 			}
 		}
-		if (this.forceSimulation.config.enableRadial) {
-			const rootCategories = preset.radial?.rootCategories ?? ["root"];
-			this.computeRadialDepths(rootCategories);
-		}
 		if (preset.links) {
 			const linkRenderer = this.graphScene.getLinkRenderer();
 			if (linkRenderer) linkRenderer.setOptions({

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fusefactory/fuse-three-forcegraph",
   "type": "module",
-  "version": "1.0.6",
+  "version": "1.0.8",
   "packageManager": "pnpm@10.6.4",
   "description": "A high-performance GPU-accelerated force-directed graph visualization library built with Three.js. Features a modular pass-based architecture for flexible and extensible force simulations.",
   "author": "Matteo Amerena",