1
0
mirror of https://github.com/troisjs/trois.git synced 2024-11-24 04:12:02 +08:00

update camera

This commit is contained in:
Kevin Levron 2020-10-07 23:38:39 +02:00
parent 10707a08cd
commit 50af37552b
2 changed files with 39 additions and 20 deletions

View File

@ -0,0 +1,34 @@
import { OrthographicCamera, Vector3 } from 'three';
import { watch } from 'vue';
import useBindProp from '../use/useBindProp.js';
export default {
inject: ['three'],
props: {
left: { type: Number, default: -1 },
right: { type: Number, default: 1 },
top: { type: Number, default: 1 },
bottom: { type: Number, default: -1 },
near: { type: Number, default: 0.1 },
far: { type: Number, default: 2000 },
zoom: { type: Number, default: 1 },
position: { type: [Object, Vector3], default: { x: 0, y: 0, z: 0 } },
},
created() {
this.camera = new OrthographicCamera(this.left, this.right, this.top, this.bottom, this.near, this.far);
useBindProp(this, 'position', this.camera.position);
['left', 'right', 'top', 'bottom', 'near', 'far', 'zoom'].forEach(p => {
watch(() => this[p], () => {
this.camera[p] = this[p];
this.camera.updateProjectionMatrix();
});
});
this.three.camera = this.camera;
},
render() {
return [];
},
__hmrId: 'OrthographicCamera',
};

View File

@ -5,26 +5,11 @@ import useBindProp from '../use/useBindProp.js';
export default {
inject: ['three'],
props: {
aspect: {
type: Number,
default: 1,
},
far: {
type: Number,
default: 2000,
},
fov: {
type: Number,
default: 50,
},
near: {
type: Number,
default: 0.1,
},
position: {
type: [Object, Vector3],
default: { x: 0, y: 0, z: 0 },
},
aspect: { type: Number, default: 1 },
far: { type: Number, default: 2000 },
fov: { type: Number, default: 50 },
near: { type: Number, default: 0.1 },
position: { type: [Object, Vector3], default: { x: 0, y: 0, z: 0 } },
},
created() {
this.camera = new PerspectiveCamera(this.fov, this.aspect, this.near, this.far);