bx-1316-refactoring #14
|
@ -34,6 +34,7 @@ const loadEnv = async () => {
|
||||||
const exrCubeRenderTarget = pmremGenerator.fromEquirectangular(result.renderTarget.texture);
|
const exrCubeRenderTarget = pmremGenerator.fromEquirectangular(result.renderTarget.texture);
|
||||||
const newEnvMap = exrCubeRenderTarget ? exrCubeRenderTarget.texture : null;
|
const newEnvMap = exrCubeRenderTarget ? exrCubeRenderTarget.texture : null;
|
||||||
|
|
||||||
|
// scene.value.background = result.renderTarget.texture
|
||||||
scene.value.environment = newEnvMap
|
scene.value.environment = newEnvMap
|
||||||
scene.value.environmentIntensity = 1
|
scene.value.environmentIntensity = 1
|
||||||
|
|
||||||
|
|
|
@ -32,7 +32,7 @@ const loading_store = useLoading()
|
||||||
|
|
||||||
const { controls, camera, scene, raycaster, renderer } = useTresContext()
|
const { controls, camera, scene, raycaster, renderer } = useTresContext()
|
||||||
const { pause, resume } = useLoop()
|
const { pause, resume } = useLoop()
|
||||||
const { seekByName, seekAllByName, seek } = useSeek()
|
const { seekByName, seekAllByName } = useSeek()
|
||||||
|
|
||||||
const groundTexture = await useTexture({
|
const groundTexture = await useTexture({
|
||||||
displacementMap: '/ground_displacement.jpg',
|
displacementMap: '/ground_displacement.jpg',
|
||||||
|
@ -48,13 +48,13 @@ setInterval(() => {
|
||||||
pause()
|
pause()
|
||||||
if (controls.value && camera.value) {
|
if (controls.value && camera.value) {
|
||||||
camera.value?.position.set(
|
camera.value?.position.set(
|
||||||
(controls.value as any).maxDistance * 0.5,
|
(controls.value as any).maxDistance * 0.5,
|
||||||
(controls.value as any).maxDistance * 0.5,
|
(controls.value as any).maxDistance * 0.5,
|
||||||
(controls.value as any).maxDistance * 0.5
|
(controls.value as any).maxDistance * 0.5
|
||||||
);
|
);
|
||||||
(controls.value as any).target = new Vector3(0, 0, 0);
|
(controls.value as any).target = new Vector3(0, 0, 0);
|
||||||
(controls.value as any).autoRotate = true;
|
(controls.value as any).autoRotate = true;
|
||||||
(controls.value as any).autoRotateSpeed = 1;
|
(controls.value as any).autoRotateSpeed = 0.5;
|
||||||
}
|
}
|
||||||
resume()
|
resume()
|
||||||
}
|
}
|
||||||
|
@ -87,10 +87,10 @@ const loadModels = async () => {
|
||||||
(controls.value as any).maxDistance = raw_data.max_distance;
|
(controls.value as any).maxDistance = raw_data.max_distance;
|
||||||
|
|
||||||
camera.value?.position.set(
|
camera.value?.position.set(
|
||||||
(controls.value as any).maxDistance * 0.5,
|
(controls.value as any).maxDistance * 0.5,
|
||||||
(controls.value as any).maxDistance * 0.5,
|
(controls.value as any).maxDistance * 0.5,
|
||||||
(controls.value as any).maxDistance * 0.5
|
(controls.value as any).maxDistance * 0.5
|
||||||
);
|
);
|
||||||
(controls.value as any).target = new Vector3(0, 0, 0);
|
(controls.value as any).target = new Vector3(0, 0, 0);
|
||||||
(controls.value as any).autoRotate = false;
|
(controls.value as any).autoRotate = false;
|
||||||
|
|
||||||
|
@ -215,7 +215,6 @@ const loadModels = async () => {
|
||||||
new Vector3(box_size.x * 0.5, box_size.y * 0.5, box_size.z * 0.5),
|
new Vector3(box_size.x * 0.5, box_size.y * 0.5, box_size.z * 0.5),
|
||||||
new Vector3(box_size.x * -0.5, box_size.y * -0.25, box_size.z * -0.5),
|
new Vector3(box_size.x * -0.5, box_size.y * -0.25, box_size.z * -0.5),
|
||||||
)
|
)
|
||||||
console.log(box_size)
|
|
||||||
controls.value.enabled = true;
|
controls.value.enabled = true;
|
||||||
props.loaded(false)
|
props.loaded(false)
|
||||||
|
|
||||||
|
@ -224,14 +223,20 @@ const loadModels = async () => {
|
||||||
(controls.value as any).autoRotate = false;
|
(controls.value as any).autoRotate = false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
const lookAtCamera = (obj) => {
|
||||||
|
if (!obj || !obj.children) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
obj.children.forEach(element => {
|
||||||
|
if (element && typeof element.lookAt == 'function') {
|
||||||
|
element.lookAt(camera.value?.position)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
const { onAfterRender } = useLoop()
|
const { onAfterRender } = useLoop()
|
||||||
onAfterRender(() => {
|
onAfterRender(() => {
|
||||||
clickable_refs.value.map(el => {
|
clickable_refs.value.map(el => {
|
||||||
if (el.value[0] && el.value[0].children && el.value[0].children[0] && typeof el.value[0].children[0].lookAt == 'function') {
|
lookAtCamera(el.value[0])
|
||||||
el.value[0].children[0].lookAt(camera.value?.position);
|
|
||||||
el.value[0].children[1].lookAt(camera.value?.position);
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
if (controls.value) {
|
if (controls.value) {
|
||||||
if (timer.value == 0) {
|
if (timer.value == 0) {
|
||||||
|
|
|
@ -69,7 +69,7 @@ const sidebarFunc = () => {
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div v-if="models_loading"
|
<div v-if="models_loading"
|
||||||
style="position: absolute; z-index: 10; font-size: 6rem; top: 50%; left: 50%;">
|
style="position: absolute; z-index: 10; font-size: 6rem; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0);">
|
||||||
{{loading_store.getStatus()}}
|
{{loading_store.getStatus()}}
|
||||||
</div>
|
</div>
|
||||||
<div :class="[{ 'loading': models_loading }, 'canvas-wrapper']">
|
<div :class="[{ 'loading': models_loading }, 'canvas-wrapper']">
|
||||||
|
|
Loading…
Reference in New Issue