mirror of
https://github.com/troisjs/trois.git
synced 2024-11-24 04:12:02 +08:00
add camera props
This commit is contained in:
parent
2029497e11
commit
802b299e77
@ -12,6 +12,10 @@ export default defineComponent({
|
|||||||
// TODO: eventually extend Object3D
|
// TODO: eventually extend Object3D
|
||||||
// extends: Object3D,
|
// extends: Object3D,
|
||||||
|
|
||||||
|
props: {
|
||||||
|
props: { type: Object, default: () => ({}) },
|
||||||
|
},
|
||||||
|
|
||||||
// inject: { renderer: RendererInjectionKey as symbol },
|
// inject: { renderer: RendererInjectionKey as symbol },
|
||||||
|
|
||||||
// setup(): CameraSetupInterface {
|
// setup(): CameraSetupInterface {
|
||||||
@ -22,3 +26,8 @@ export default defineComponent({
|
|||||||
return this.$slots.default ? this.$slots.default() : []
|
return this.$slots.default ? this.$slots.default() : []
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
|
export function cameraSetProp(camera: any, key: string, value: any, updateProjectionMatrix = true) {
|
||||||
|
camera[key] = value
|
||||||
|
if (updateProjectionMatrix) camera.updateProjectionMatrix()
|
||||||
|
}
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import { defineComponent, inject, PropType, watch } from 'vue'
|
import { defineComponent, inject, PropType, watch } from 'vue'
|
||||||
import { OrthographicCamera } from 'three'
|
import { OrthographicCamera } from 'three'
|
||||||
import { bindProp } from '../tools'
|
import { bindObjectProp, bindProp } from '../tools'
|
||||||
import Camera from './Camera'
|
import Camera, { cameraSetProp } from './Camera'
|
||||||
import { Vector3PropInterface } from './Object3D'
|
import { Vector3PropInterface } from './Object3D'
|
||||||
import { RendererInjectionKey } from './Renderer'
|
import { RendererInjectionKey } from './Renderer'
|
||||||
|
|
||||||
@ -29,14 +29,12 @@ export default defineComponent({
|
|||||||
renderer.camera = camera
|
renderer.camera = camera
|
||||||
|
|
||||||
bindProp(props, 'position', camera)
|
bindProp(props, 'position', camera)
|
||||||
|
bindObjectProp(props, 'props', camera, true, cameraSetProp);
|
||||||
|
|
||||||
const watchProps = ['left', 'right', 'top', 'bottom', 'near', 'far', 'zoom']
|
['left', 'right', 'top', 'bottom', 'near', 'far', 'zoom'].forEach(p => {
|
||||||
watchProps.forEach(p => {
|
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
watch(() => props[p], (value) => {
|
watch(() => props[p], (value) => {
|
||||||
// @ts-ignore
|
cameraSetProp(camera, p, value)
|
||||||
camera[p] = value
|
|
||||||
camera.updateProjectionMatrix()
|
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import { defineComponent, inject, PropType, watch } from 'vue'
|
import { defineComponent, inject, PropType, watch } from 'vue'
|
||||||
import { PerspectiveCamera } from 'three'
|
import { PerspectiveCamera } from 'three'
|
||||||
import { bindProp } from '../tools'
|
import { bindObjectProp, bindProp } from '../tools'
|
||||||
import Camera from './Camera'
|
import Camera, { cameraSetProp } from './Camera'
|
||||||
import { Vector3PropInterface } from './Object3D'
|
import { Vector3PropInterface } from './Object3D'
|
||||||
import { RendererInjectionKey } from './Renderer'
|
import { RendererInjectionKey } from './Renderer'
|
||||||
|
|
||||||
@ -31,13 +31,12 @@ export default defineComponent({
|
|||||||
if (props.lookAt) camera.lookAt(props.lookAt.x ?? 0, props.lookAt.y, props.lookAt.z)
|
if (props.lookAt) camera.lookAt(props.lookAt.x ?? 0, props.lookAt.y, props.lookAt.z)
|
||||||
watch(() => props.lookAt, (v) => { camera.lookAt(v.x ?? 0, v.y, v.z) }, { deep: true })
|
watch(() => props.lookAt, (v) => { camera.lookAt(v.x ?? 0, v.y, v.z) }, { deep: true })
|
||||||
|
|
||||||
const watchProps = ['aspect', 'far', 'fov', 'near']
|
bindObjectProp(props, 'props', camera, true, cameraSetProp);
|
||||||
watchProps.forEach(p => {
|
|
||||||
|
['aspect', 'far', 'fov', 'near'].forEach(p => {
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
watch(() => props[p], (value) => {
|
watch(() => props[p], (value) => {
|
||||||
// @ts-ignore
|
cameraSetProp(camera, p, value)
|
||||||
camera[p] = value
|
|
||||||
camera.updateProjectionMatrix()
|
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user