forked from mns/mini-skamja
40 lines
1.2 KiB
Vue
40 lines
1.2 KiB
Vue
<script setup lang="ts">
|
|
import {
|
|
PCFSoftShadowMap,
|
|
CineonToneMapping,
|
|
PMREMGenerator,
|
|
} from 'three';
|
|
|
|
import { GainMapLoader, } from '@monogrid/gainmap-js'
|
|
|
|
const { scene, renderer, camera } = useTresContext()
|
|
|
|
renderer.value.toneMapping = CineonToneMapping
|
|
renderer.value.toneMappingExposure = 1
|
|
|
|
renderer.value.shadowMap.enabled = true
|
|
renderer.value.shadowMap.type = PCFSoftShadowMap
|
|
|
|
const pmremGenerator = new PMREMGenerator(renderer.value);
|
|
pmremGenerator.compileEquirectangularShader();
|
|
|
|
onMounted(async () => {
|
|
const loader = new GainMapLoader(renderer.value)
|
|
const result = await loader.loadAsync([
|
|
'hdrmaps/hdr.webp',
|
|
'hdrmaps/hdr-gainmap.webp',
|
|
'hdrmaps/hdr.json',
|
|
])
|
|
if (renderer.value && camera.value) {
|
|
renderer.value.render(scene.value, camera.value)
|
|
}
|
|
const exrCubeRenderTarget = pmremGenerator.fromEquirectangular(result.renderTarget.texture);
|
|
const newEnvMap = exrCubeRenderTarget ? exrCubeRenderTarget.texture : null;
|
|
|
|
scene.value.environment = newEnvMap
|
|
scene.value.environmentIntensity = 1.25
|
|
scene.value.environmentRotation.z = 0.25
|
|
result.renderTarget.texture.dispose();
|
|
})
|
|
</script>
|
|
<template></template> |