Hello,
Basically, I’m trying to get the field of from 70 to 90, and when I try to reference it, i.e:
console.log(this.camera.fieldofview);
It returns as undefined, any help please?
alright so what about changing the fov from 70 to 90 in 0.5 seconds?
Check here for a tween example, animating the fov:
1 Like
got this error, and the fov isn’t changing, here is my script
var FieldOfview = pc.createScript('fieldOfview');
// initialize code called once per entity
FieldOfview.prototype.initialize = function() {
};
// update code called every frame
FieldOfview.prototype.update = function(dt) {
var fov = this.camera.camera.fov;
if (this.app.keyboard.isPressed(pc.KEY_SHIFT)) {
this.app
.tween(data)
.to({fov: 90},0.5, pc.Linear)
.yoyo(true)
.loop(true)
.on('update', () => {
cameraEntity.
camera.fov = data.fov;
})
.start();
}
};
If it helps, I put the script in the camera.
I did, now it’s telling me this.app.tween is not a function.
I decided to put it into my movement script and now this is what it looks like:
// Obviously, credit to Playcanvas for this script, I just fixed the bugs and added features of my own.
var FirstPersonMovement = pc.createScript('firstPersonMovement');
FirstPersonMovement.attributes.add('camera', {
type: 'entity',
description: 'Optional, assign a camera entity, otherwise one is created'
});
FirstPersonMovement.attributes.add('power', {
type: 'number',
default: 1500,
description: 'Adjusts the speed of player movement'
});
FirstPersonMovement.attributes.add('lookSpeed', {
type: 'number',
default: 0.25,
description: 'Adjusts the sensitivity of looking'
});
// initialize code called once per entity
FirstPersonMovement.prototype.initialize = function() {
this.force = new pc.Vec3();
this.eulers = new pc.Vec3();
var app = this.app;
// Listen for mouse move events
app.mouse.on("mousemove", this._onMouseMove, this);
// when the mouse is clicked hide the cursor
app.mouse.on("mousedown", function () {
app.mouse.enablePointerLock();
}, this);
// Check for required components
if (!this.entity.collision) {
console.error("First Person Movement script needs to have a 'collision' component");
}
if (!this.entity.rigidbody || this.entity.rigidbody.type !== pc.BODYTYPE_DYNAMIC) {
console.error("First Person Movement script needs to have a DYNAMIC 'rigidbody' component");
}
this.canJump = false;
this.entity.collision.on('collisionstart',function() {
this.canJump = true;
},this);
};
// update code called every frame
FirstPersonMovement.prototype.update = function(dt) {
// If a camera isn't assigned from the Editor, create one
if (!this.camera) {
this._createCamera();
}
var force = this.force;
var app = this.app;
// Get camera directions to determine movement directions
var forward = this.camera.forward;
var right = this.camera.right;
// movement
var x = 0;
var z = 0;
// Use W-A-S-D keys to move player
// Check for key presses
if (app.keyboard.isPressed(pc.KEY_A)) {
x -= right.x;
z -= right.z;
}
if (app.keyboard.isPressed(pc.KEY_D)) {
x += right.x;
z += right.z;
}
if (app.keyboard.isPressed(pc.KEY_W)) {
x += forward.x;
z += forward.z;
}
if (app.keyboard.isPressed(pc.KEY_S)) {
x -= forward.x;
z -= forward.z;
}
// Shift to run
if (app.keyboard.isPressed(pc.KEY_SHIFT)) {
this.power = 3000;
var cameraEntity = this.camera;
var data = {
fov: cameraEntity.camera.fov
};
this.app
.tween(data)
.to({fov: 90},0.5, pc.Linear)
.yoyo(true)
.loop(true)
.on('update', () => {
cameraEntity.
camera.fov = data.fov;
})
.start();
} else {
this.power = 1500;
}
if (this.app.keyboard.isPressed(32) && this.canJump === true) {
this.entity.rigidbody.applyImpulse(0, 1000, 0);
this.canJump = false;
}
// use direction from keypresses to apply a force to the character
if (x !== 0 && z !== 0) {
force.set(x, 0, z).normalize().scale(this.power);
this.entity.rigidbody.applyForce(force);
}
// update camera angle from mouse events
this.camera.setLocalEulerAngles(this.eulers.y, this.eulers.x, 0);
};
FirstPersonMovement.prototype._onMouseMove = function (e) {
// If pointer is disabled
// If the left mouse button is down update the camera from mouse movement
if (pc.Mouse.isPointerLocked() || e.buttons[0]) {
this.eulers.y -= this.lookSpeed * e.dy;
this.eulers.x -= this.lookSpeed * e.dx;
}
this.eulers.y = pc.math.clamp(this.eulers.y, -90, 90);
};
Did you add the tween.js script to your project?
I thought that was built in?? How do you do it?
You can find all you need on the page below.
I added it, but now I don’t notice any fov changes, and there are no errors.
just realized the fov wasn’t changing at all, any help please?
Can you share the editor link of your project so someone can take a look?
1 Like
I forked your project and with your code above it works as expected.
Maybe you need to change your logic, because if you hold down the shift key it will break.
huh that’s weird, when I hold down shift, it doesn’t do anything to the field of view, something must be up
What happens if you just press the shift key with your code above? For me the field of view of the camera is changing.
i usually move and press shift at the same time and the fov stays at 70
What you can do is to check with a statement if the field of view is 70, before you use the tween. Your field of view stays at 70 at the moment, because your current code does not change it anymore. Please use your code above.
how about if i need to make it return back to 70 when the player stop holding shift, what do i do then?