First Individual Digicam Rotation In direction of Mouse – Cocos Creator

Hello All,

I’m trying to make some first individual controls to attempt to see how all the pieces works. I could also be wanting in all of the mistaken locations however I appear to be struggling to search out examples and many others 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 connected this to the participant.

That is the participant script:

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

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

    /* Native Variables */

        personal movementSpeed = 3;
        personal moveForward = 0;
        personal moveBackward = 0;
        personal moveLeft = 0;
        personal moveRight = 0;
        personal nodePos: Vec3 = new Vec3();
        personal 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){
        change(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){
        change(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, Element, Node } from 'cc';
const { ccclass, property } = _decorator;

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

        public character;
        public digital camera;

    /* 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 digital camera script. Undecided if that’s the proper manner round it (these are my first scripts in cocos ever).

So now I’ve created a digital camera script and connected it to digital camera.

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

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

    /* Native Variables */

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

    /* Finish Native Variables */

    begin() {
        globalVars.digital camera = 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 digital camera 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 after I do that:

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

Aside from this instance I couldn’t discover the rest of use. I attempted another issues too. I got here shut but it surely was very Janky and I forgot what I did to realize that now.

Has anyone acquired any concepts for an answer?

Thanks,
-iDev