diff --git a/gui.js b/gui.js index 08a7bdd..45e8f87 100644 --- a/gui.js +++ b/gui.js @@ -14,6 +14,7 @@ const DEFAULTS = { color: 0x3293a9, background: 0xd4d4d4, hyperplane: 1.5, + zoom: 1, rotation: 'rigid', dtheta: 0, dpsi: 0, @@ -42,6 +43,7 @@ class FourDGUI { color: this.link['color'], background: this.link['background'], hyperplane: this.link['hyperplane'], + zoom: this.link['zoom'], rotation: this.link['rotation'], damping: false, dtheta: this.link['dtheta'], @@ -58,10 +60,11 @@ class FourDGUI { changeShape(shape) }); const options = this.getShapeOptions(shapes, this.params['shape']); - options_ctrl = this.gui.add(this.params, 'option', options).onChange((option) => { + options_ctrl = this.gui.add(this.params, 'option').options(options).onChange((option) => { setVisibility(option) }); - this.gui.add(this.params, 'hyperplane', 1.4, 2.4); + this.gui.add(this.params, 'hyperplane', 1.4, 2.0); + this.gui.add(this.params, 'zoom', 0.1, 2.0); this.gui.add(this.params, 'thickness', 0.1, 2); this.gui.add(this.params, 'linkopacity', 0, 1).onChange( (v) => setLinkOpacity(v, true) @@ -127,6 +130,7 @@ class FourDGUI { this.link[param] = ( this.urlParams.get(param) === 'y' ); } this.link['hyperplane'] = this.numParam('hyperplane', parseFloat); + this.link['zoom'] = this.numParam('zoom', parseFloat); this.link['thickness'] = this.numParam('thickness', parseFloat); this.link['linkopacity'] = this.numParam('linkopacity', parseFloat); this.link['link2opacity'] = this.numParam('link2opacity', parseFloat); @@ -151,6 +155,7 @@ class FourDGUI { url.searchParams.append("color", this.hexToString(this.params.color)); url.searchParams.append("background", this.hexToString(this.params.background)); url.searchParams.append("hyperplane", this.params.hyperplane.toString()); + url.searchParams.append("zoom", this.params.zoom.toString()); url.searchParams.append("rotation", this.params.rotation); url.searchParams.append("dtheta", this.params.dtheta.toString()); url.searchParams.append("dpsi", this.params.dpsi.toString()); diff --git a/main.js b/main.js index 02ba6dc..a6ada43 100644 --- a/main.js +++ b/main.js @@ -200,7 +200,7 @@ function animate() { const rotations = get_rotation(gui.params.rotation, theta, psi); shape.hyperplane = gui.params.hyperplane; - camera.position.set(0, 0, CAMERA_K / gui.params.hyperplane); + camera.position.set(0, 0, gui.params.zoom * CAMERA_K / gui.params.hyperplane); shape.link_scale = gui.params.thickness; shape.node_scale = gui.params.nodesize;