Hi,
I’m using engine to develop my project not editor and I found that I can’t make light look at the origin like bellow.
const light1 = new pc.Entity('light1');
const light1Light = new pc.Entity("light1Light");
light1Light.addComponent('light', {
type: "spot",
innerConeAngle: 0,
outerConeAngle: 5,
range: 20,
intensity: 100,
});
light1.addComponent("script");
light1.addChild(light1Light);
light1.setPosition(0, -5, 0);
light1.lookAt(pc.Vec3.ZERO);
I call the code above before app.start()
.
The forward vector of light1 after lookAt
is still (0,0,-1), and the most strange thing is the value will keep changing when I orbit control camera and call lookAt to orgin every frames.
export class LightControl extends pc.ScriptType {
initialize(): void {
this.entity.lookAt(pc.Vec3.ZERO);
}
update(dt: number): void {
this.entity.lookAt(pc.Vec3.ZERO);
}
}
I can make sure that My CameraController (bellow) script is attached to Camera entity not Light Entity.
import * as pc from "playcanvas";
export class CameraController extends pc.ScriptType {
private leftDown = false;
private rightDown = false;
private rotation = new pc.Mat4().setIdentity();
private center = new pc.Vec3();
private distanceFromCenter = 3;
public initialize(): void {
const { app } = this;
this.updateTransform();
app.mouse.disableContextMenu();
app.mouse.on(pc.EVENT_MOUSEDOWN, this.onMouseDown, this);
app.mouse.on(pc.EVENT_MOUSEMOVE, this.onMouseMove, this);
app.mouse.on(pc.EVENT_MOUSEUP, this.onMouseUp, this);
app.mouse.on(pc.EVENT_MOUSEWHEEL, this.onMouseWheel, this);
this.on("destroy", () => {
app.mouse.off(pc.EVENT_MOUSEDOWN, this.onMouseDown);
app.mouse.off(pc.EVENT_MOUSEMOVE, this.onMouseMove);
app.mouse.off(pc.EVENT_MOUSEUP, this.onMouseUp);
});
}
private onMouseDown(event: pc.MouseEvent) {
switch (event.button) {
case pc.MOUSEBUTTON_LEFT:
this.leftDown = true;
break;
case pc.MOUSEBUTTON_RIGHT:
this.rightDown = true;
break;
default:
break;
}
}
private onMouseMove(event: pc.MouseEvent) {
if (this.leftDown) {
const deltaY = new pc.Mat4().setFromEulerAngles(0, -event.dx / 10, 0);
const deltaX = new pc.Mat4().setFromEulerAngles(-event.dy / 10, 0, 0);
this.rotation = deltaY.mul(this.rotation.mul(deltaX));
this.updateTransform();
} else if (this.rightDown) {
const offset = this.rotation.transformVector(new pc.Vec3(-event.dx / 1000, event.dy / 1000, 0));
this.center.add(offset);
this.updateTransform();
}
}
private onMouseUp(event: pc.MouseEvent) {
switch (event.button) {
case pc.MOUSEBUTTON_LEFT:
this.leftDown = false;
break;
case pc.MOUSEBUTTON_RIGHT:
this.rightDown = false;
break;
default:
break;
}
}
private onMouseWheel(event: pc.MouseEvent) {
this.distanceFromCenter /= Math.pow(0.9, event.wheelDelta);
this.distanceFromCenter = Math.max(this.distanceFromCenter, 0.5)
this.distanceFromCenter = Math.min(this.distanceFromCenter, 10)
this.updateTransform();
}
private updateTransform() {
const translation = new pc.Mat4().setTranslate(this.center.x, this.center.y, this.center.z);
const delta = new pc.Mat4().setTranslate(0, 0, this.distanceFromCenter);
const transform = translation.mul(this.rotation.clone().mul(delta))
this.entity.setRotation(new pc.Quat().setFromEulerAngles(transform.getEulerAngles()))
this.entity.setPosition(transform.getTranslation())
}
}