I'm working on developing a game using A-frame. I'm trying to add a shooting effect by incorporating a gun model that follows the user's cursor. I've coded a click event so that an object moves in front of the gun and follows the direction of the cursor.
My approach involves using setAttribute
and requestAnimationFrame:
renderObj: function(obj){
window.requestAnimationFrame(function() {
renderObj(obj);
});
}
This setup helps create the animation of the bullet moving in a specified direction.
However, I'm encountering issues when I attempt to retrieve the object's location after it has been set with setAttribute. Here is how I tried to get the location:
var objWorldPos = new THREE.Vector3();
objWorldPos.setFromMatrixPosition(obj.object3D.matrixWorld);
When I change the position using setAttribute, I update the attribute in the bullet tag with obj.attributes.position="x y z";
. I'm aware this might not be the optimal approach, and I'm wondering if there's a way to set the element's position using three.js and retrieve it using
THREE.Vector3()'s object3D.matrixWorld
method...
Any assistance on this matter would be greatly appreciated. Thank you!