Is there a way to configure a Three.js scene so that clicking on a link can change the scene's view? I assumed it would be simple to create a function to modify the scene and then call that function through a link, but I have been unable to make it work.
This is the function I have:
function loadview($x,$y) {
group.position.x = $x;
group.position.y = $y;
requestAnimationFrame(render);
webGLRenderer.render(scene, camera);
}
Here is my link:
<a href="#" onclick="loadscene(100,100)">TEST</a>
I have also attempted:
<a href="javascript:loadview(100,100);">TEST</a>
When I include the function inside the render function (for testing purposes), it functions correctly:
function render() {
trackballControls.update(60);
loadview(100,50);
// render using requestAnimationFrame
requestAnimationFrame(render);
webGLRenderer.render(scene, camera);
}
However, if I call the function outside of the render function, it does not work:
function render() {
trackballControls.update(60);
// render using requestAnimationFrame
requestAnimationFrame(render);
webGLRenderer.render(scene, camera);
}
loadview(100,50);
Ultimately, my goal is to be able to click a link to change both the object position and the camera position in the scene.
Here is the test page I am currently working on: