Being new to JavaScript, I'm trying to save the Vector position and use two buttons (forward and backward) to move the Camera to that specific location. I also attempted to incorporate 'gsap' for smooth movements, but unfortunately, the code isn't functioning properly.
//Coordinates
let positionIndex = 0;
const positions = [
{
x: -0.05,
y: 0.6,
z: -0.17
},
{
x: -2,
y: 1,
z: 1
},
{
x: 0.3,
y: 0.6,
z: -0.6
}
]
//on button forward clicked
var element = document.querySelector(".button-1");
element.onclick = function MoveUp(){
if(positionIndex == 3)
{
positionIndex = 0;
}
else
{
positionIndex += 1;
}}
camera.position.x = positions[positionIndex].x
camera.position.y = positions[positionIndex].y
camera.position.z = positions[positionIndex].z
//on button backwards clicked
var element = document.querySelector(".button-2");
element.onclick = function MoveDown(){
if(positionIndex == 0)
{
positionIndex = 3;
}
else
{
positionIndex -= 1;
}}
camera.position.x = positions[positionIndex].x
camera.position.y = positions[positionIndex].y
camera.position.z = positions[positionIndex].z
Any advice from someone who can help me troubleshoot this issue would be greatly appreciated.
Thank you.