First Individual Digicam Rotation In the direction of Mouse – Cocos Creator

Hello All,

I’m making an attempt to make some first individual controls to attempt to see how every part works. I could also be wanting in all of the incorrect locations however I appear to be struggling to seek out examples and so on to assist out.

To this point I’ve created a capsule to be the participant and a terrain. It took awhile to determine this out and of coarse is smart now however I couldn’t discover something explaining this however including the physics to the participant and the terrain. So to do that appropriately in the long run I give the participant a rigidbody then a field collider. The terrain then must be given rigidbody (static) after which the terrain collider. I’ve created a script to then transfer the participant relying on the AWSD keys being pressed and hooked up this to the participant.

That is the participant script:

import { _decorator, Part, Node, systemEvent, enter, Enter, KeyCode, EventKeyboard, Vec3, SystemEventType } from 'cc';
import { globalVars } from './globalVars';
const { ccclass, property } = _decorator;

@ccclass('PlayerScript')
export class PlayerScript extends Part {

    /* Native Variables */

        non-public movementSpeed = 3;
        non-public moveForward = 0;
        non-public moveBackward = 0;
        non-public moveLeft = 0;
        non-public moveRight = 0;
        non-public nodePos: Vec3 = new Vec3();
        non-public nodeDeltaPos: Vec3 = new Vec3(0, 0, 0);

    /* Finish Native Variables */
    
    begin() {
        globalVars.character = this;
        enter.on(Enter.EventType.KEY_DOWN, this.onKeyDown, this);
        enter.on(Enter.EventType.KEY_UP, this.onKeyUp, this);
    }

    onKeyDown(occasion: EventKeyboard){
        swap(occasion.keyCode) {
            case KeyCode.KEY_A: {
                this.moveLeft = 1;
            break;}

            case KeyCode.KEY_W: {
                this.moveForward = 1;
            break;}

            case KeyCode.KEY_D: {
                this.moveRight = 1;
            break;}

            case KeyCode.KEY_S: {
                this.moveBackward = 1;
            break;}
        }
    }

    onKeyUp(occasion: EventKeyboard){
        swap(occasion.keyCode) {
            case KeyCode.KEY_A: {
                this.moveLeft = 0;
            break;}

            case KeyCode.KEY_W: {
                this.moveForward = 0;
            break;}

            case KeyCode.KEY_D: {
                this.moveRight = 0;
            break;}

            case KeyCode.KEY_S: {
                this.moveBackward = 0;
            break;}
        }
    }

    replace(deltaTime: quantity) {
        if(this.moveForward){
            this.nodePos = this.node.getPosition();
                if(this.moveLeft || this.moveRight){
                    this.nodeDeltaPos.x = (this.movementSpeed/2) * deltaTime;
                } else {
                    this.nodeDeltaPos.x = this.movementSpeed * deltaTime;
                }
            Vec3.add(this.nodePos, this.nodePos, this.nodeDeltaPos);
            this.node.setPosition(this.nodePos);
        }
        if(this.moveBackward){
            this.nodePos = this.node.getPosition();
                if(this.moveLeft || this.moveRight){
                    this.nodeDeltaPos.x = -(this.movementSpeed/2) * deltaTime;
                } else {
                    this.nodeDeltaPos.x = -this.movementSpeed * deltaTime;
                }
            Vec3.add(this.nodePos, this.nodePos, this.nodeDeltaPos);
            this.node.setPosition(this.nodePos);
        }
        if(this.moveLeft){
            this.nodePos = this.node.getPosition();
                if(this.moveForward || this.moveBackward){
                    this.nodeDeltaPos.z = -(this.movementSpeed/2) * deltaTime;
                } else {
                    this.nodeDeltaPos.z = -this.movementSpeed * deltaTime;
                }
            Vec3.add(this.nodePos, this.nodePos, this.nodeDeltaPos);
            this.node.setPosition(this.nodePos);
        }
        if(this.moveRight){
            this.nodePos = this.node.getPosition();
                if(this.moveForward || this.moveBackward){
                    this.nodeDeltaPos.z = (this.movementSpeed/2) * deltaTime;
                } else {
                    this.nodeDeltaPos.z = this.movementSpeed * deltaTime;
                }
            Vec3.add(this.nodePos, this.nodePos, this.nodeDeltaPos);
            this.node.setPosition(this.nodePos);
        }
    }
}

I’ve created a separate globalVars script like this:

import { _decorator, Part, Node } from 'cc';
const { ccclass, property } = _decorator;

@ccclass('globalVars')
export class globalVars extends Part {
    
    /* International Variables */

        public character;
        public digicam;

    /* Finish International Variables */
}

As you possibly can see within the participant script. I set this because the character within the globalVars, that enables me to work together with the character within the digicam script. Unsure if that’s the proper manner round it (these are my first scripts in cocos ever).

So now I’ve created a digicam script and hooked up it to digicam.

import { _decorator, Part, Enter, Vec3, enter, math, Quaternion, Quat, Node, quat } from 'cc';
import { globalVars } from './globalVars';
const { ccclass, property } = _decorator;

@ccclass('cameraScript')
export class cameraScript extends Part {

    /* Native Variables */

    non-public mousePos: Vec3 = new Vec3(0, 0, 0);
    non-public angleX;
    non-public angleY;
    non-public xAxisMin = 45
    non-public xAxisMax = 180;

    /* Finish Native Variables */

    begin() {
        globalVars.digicam = this;
        enter.on(Enter.EventType.MOUSE_MOVE, this.onMouseMove, this);
    }

    replace(deltaTime: quantity) {
        this.node.setPosition(globalVars.character.node.getPosition());
    }

    onMouseMove(occasion:EventMouse){

        this.angleX += -event.movementX; 
        this.angleY += -event.movementY;

        this.angleY=math.clamp(this.angleY,this.xAxisMin,this.xAxisMax);

        this.node.rotation= Quaternion.GetQuatFromAngle(new Vec3(this.angleY,this.angleX,0));
    }
}

So this script units the place of the digicam to the character. The rotation is a script instance I discovered else the place on the boards (unable to hyperlink this).

Though I solely get this error once I do this:

Can't learn properties of undefined (studying 'GetQuatFromAngle')

Other than this instance I couldn’t discover anything of use. I attempted another issues too. I got here shut nevertheless it was very Janky and I forgot what I did to attain that now.

Has anyone obtained any concepts for an answer?

Thanks,
-iDev