mirror of
https://gitee.com/ice-gl/icegl-three-vue-tres.git
synced 2025-04-05 06:22:43 +08:00
no message
This commit is contained in:
parent
8cebc6850d
commit
a5e3f64e89
BIN
public/plugins/basic/shine/preview/effectComposerShaderPass.png
Normal file
BIN
public/plugins/basic/shine/preview/effectComposerShaderPass.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 113 KiB |
BIN
public/plugins/earthSample/preview/lowpolyPlanet.png
Normal file
BIN
public/plugins/earthSample/preview/lowpolyPlanet.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 70 KiB |
32
src/plugins/basic/pages/shine/effectComposerShaderPass.vue
Normal file
32
src/plugins/basic/pages/shine/effectComposerShaderPass.vue
Normal file
@ -0,0 +1,32 @@
|
||||
<!--
|
||||
* @Description:
|
||||
* @Version: 1.668
|
||||
* @Autor: 地虎降天龙
|
||||
* @Date: 2024-01-09 15:02:26
|
||||
* @LastEditors: 地虎降天龙
|
||||
* @LastEditTime: 2024-07-18 10:38:20
|
||||
-->
|
||||
|
||||
<template>
|
||||
<TresCanvas renderMode="manual" window-size ref="tcRef">
|
||||
<TresPerspectiveCamera :position="[10, 10, 10]" />
|
||||
<TresAmbientLight :intensity="1" />
|
||||
<OrbitControls />
|
||||
<TresGridHelper :args="[10, 10]" />
|
||||
<ecLayerShaderPass />
|
||||
</TresCanvas>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { OrbitControls } from '@tresjs/cientos'
|
||||
import ecLayerShaderPass from '../../components/ecLayerShaderPass.vue'
|
||||
import { watchEffect, ref } from 'vue'
|
||||
|
||||
const tcRef = ref()
|
||||
watchEffect(() => {
|
||||
if (tcRef.value) {
|
||||
let renderer = tcRef.value.context.renderer.value
|
||||
renderer.autoClear = false
|
||||
}
|
||||
})
|
||||
</script>
|
47
src/plugins/earthSample/pages/lowpolyPlanet.vue
Normal file
47
src/plugins/earthSample/pages/lowpolyPlanet.vue
Normal file
@ -0,0 +1,47 @@
|
||||
<!--
|
||||
* @Description:
|
||||
* @Version: 1.668
|
||||
* @Autor: Hawk
|
||||
* @Date: 2023-10-13 09:04:49
|
||||
* @LastEditors: 地虎降天龙
|
||||
* @LastEditTime: 2024-03-12 19:54:32
|
||||
-->
|
||||
<script setup lang="ts">
|
||||
import { useRenderLoop } from '@tresjs/core'
|
||||
import { OrbitControls, Stars } from '@tresjs/cientos'
|
||||
import { PCFSoftShadowMap, SRGBColorSpace } from 'three'
|
||||
import { shallowRef } from 'vue'
|
||||
|
||||
import loading from 'PLS/UIdemo/components/loading/default.vue'
|
||||
import Planet from '../components/lowpolyPlanet/planet.vue'
|
||||
|
||||
const gl = {
|
||||
clearColor: '#11101B',
|
||||
shadows: true,
|
||||
alpha: false,
|
||||
outputColorSpace: SRGBColorSpace,
|
||||
shadowMapType: PCFSoftShadowMap,
|
||||
useLegacyLights: true,
|
||||
}
|
||||
const yRotation = shallowRef(0)
|
||||
useRenderLoop().onLoop(({ delta }) => {
|
||||
yRotation.value += 0.02 * delta
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<loading />
|
||||
<TresCanvas v-bind="gl" window-size>
|
||||
<TresPerspectiveCamera :position="[0, 1, 5]" :fov="75" :near="0.1" :far="1000" />
|
||||
<OrbitControls />
|
||||
|
||||
<TresAmbientLight color="#484068" :intensity="1" />
|
||||
<Suspense>
|
||||
<Planet />
|
||||
</Suspense>
|
||||
<Stars :rotation="[0, yRotation, 0]" :radius="50" :depth="50" :count="5000" :size="0.3" :size-attenuation="true" />
|
||||
<TresPointLight color="#1BFFEF" :position="[0, 0, -8]" :intensity="80" cast-shadow />
|
||||
<TresDirectionalLight :position="[0, 2, 4]" :intensity="3" cast-shadow :shadow-mapSize-width="2048"
|
||||
:shadow-mapSize-height="2048" />
|
||||
</TresCanvas>
|
||||
</template>
|
Loading…
x
Reference in New Issue
Block a user