How can I get the inverse Transformation of in 2D

21 views Asked by At

I'm making a 2D javascript game engine based on p5js. I have a parent child hierarchy for the transformations of each of these objects. I'm using this code to set the world Position:

` this.parentTransform = ScriptingAPI.getComponentByName(this.engineAPI, this.gameObject.parent, "Transform");

        const parentPosition = this.parentTransform.worldPosition;
        const parentRotation = this.parentTransform.worldRotation;
        const degToRad = Math.PI / 180;

        const x1 = parentPosition.x + this.localPosition.x;
        const y1 = parentPosition.y + this.localPosition.y;

        const rotatedX = (x1 - parentPosition.x) * Math.cos(parentRotation * degToRad) - (y1 - parentPosition.y) * Math.sin(parentRotation * degToRad) + parentPosition.x;
        const rotatedY = (x1 - parentPosition.x) * Math.sin(parentRotation * degToRad) + (y1 - parentPosition.y) * Math.cos(parentRotation * degToRad) + parentPosition.y;

        this.worldPosition = {x: rotatedX, y: rotatedY}

        this.worldRotation =  this.parentTransform.worldRotation + this.localRotation;
        this.worldScale = this.localScale;`

I'm wondering how I could use a world position to set the local position. I'm thinking I would have to take the inverse transformation, but I'm a little lost on the math. I would like to avoid using a transformation matrix for simplicity, although if need be I could go down that route. Does anyone know how I might do this?

I'm hoping I could do this in a public method that looks something like ` SetLocalFromWorld(){

}`

Thanks!

0

There are 0 answers