ksenia_mikhailova
/
demo-int-table
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

check boke

This commit is contained in:
Kseninia Mikhaylova 2024-07-25 12:38:29 +03:00
parent 2cd417c762
commit 8dc0d64010
2 changed files with 27 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
front/src/components/Promo/main.vue
View File

@ -58,22 +58,22 @@ import { useControls, TresLeches } from '@tresjs/leches'
import '@tresjs/leches/dist/style.css' import '@tresjs/leches/dist/style.css'
const tres_values = useControls({ const tres_values = useControls({
focus: { focus: {
value: 96, value: 150,
min: 0, min: 0,
max: 1000, max: 200,
step: 1, step: 1,
}, },
aperture: { aperture: {
value: 0.01, value: 15,
min: 0.01, min: 1,
max: 0.1, max: 100,
step: 0.001, step: 1,
}, },
maxblur: { maxblur: {
value: 87, value: 1,
min: 0, min: 0,
max: 100, max: 100,
step: 0.01, step: 1,
}, },
}) })
</script> </script>
@ -85,7 +85,8 @@ const tres_values = useControls({
<TresPerspectiveCamera :position="cameraPosition" ref="camera" /> <TresPerspectiveCamera :position="cameraPosition" ref="camera" />
<OrbitControls v-bind="controlsState" @change="onChange" make-default /> <OrbitControls v-bind="controlsState" @change="onChange" make-default />
<Suspense> <Suspense>
<LoadModels :source="source" :loaded="set_model_load_status" :loaded_pan="loadedPan" :tres_values="tres_values" /> <LoadModels :source="source" :loaded="set_model_load_status" :loaded_pan="loadedPan"
:tres_values="tres_values" />
</Suspense> </Suspense>
<TresMesh :position-y="-1" :rotate-x="-Math.PI / 2" receive-shadow name="ground" v-if="false"> <TresMesh :position-y="-1" :rotate-x="-Math.PI / 2" receive-shadow name="ground" v-if="false">
<TresPlaneGeometry :args="[200, 200]" /> <TresPlaneGeometry :args="[200, 200]" />

23
front/src/components/Promo/post_pocessing.vue
View File

@ -21,8 +21,8 @@ if (camera.value) {
const bokehPass = new BokehPass(scene.value, camera.value, { const bokehPass = new BokehPass(scene.value, camera.value, {
focus: props.tres_values.focus.value.value, focus: props.tres_values.focus.value.value,
aperture: props.tres_values.aperture.value.value, aperture: props.tres_values.aperture.value.value * 0.00001,
maxblur: props.tres_values.maxblur.value.value maxblur: props.tres_values.maxblur.value.value * 0.01
}); });
const outputPass = new OutputPass(); const outputPass = new OutputPass();
@ -32,7 +32,7 @@ if (camera.value) {
} }
const { onAfterRender } = useLoop() const { onAfterRender } = useLoop()
onAfterRender(() => { onAfterRender(() => {
composer.render(0.1) composer.render()
}) })
watch([ watch([
props.tres_values.focus.value, props.tres_values.focus.value,
@ -40,12 +40,23 @@ watch([
props.tres_values.maxblur.value props.tres_values.maxblur.value
], () => { ], () => {
if (camera.value) { if (camera.value) {
const args = {
focus: props.tres_values.focus.value.value,
aperture: props.tres_values.aperture.value.value * 0.00001,
maxblur: props.tres_values.maxblur.value.value * 0.01
}
console.log(args)
const bokehPass = new BokehPass(scene.value, camera.value, { const bokehPass = new BokehPass(scene.value, camera.value, {
focus: props.tres_values.focus.value.value, focus: props.tres_values.focus.value.value,
aperture: props.tres_values.aperture.value.value, aperture: props.tres_values.aperture.value.value * 0.00001,
maxblur: props.tres_values.maxblur.value.value maxblur: props.tres_values.maxblur.value.value * 0.01
}); });
composer.passes[1] = bokehPass; composer.passes = []
const renderPass = new RenderPass(scene.value, camera.value);
const outputPass = new OutputPass();
composer.addPass(renderPass);
composer.addPass(bokehPass);
composer.addPass(outputPass);
} }
}, { deep: true }) }, { deep: true })
</script> </script>