Web3D/trois
1
0
Fork 0
mirror of https://github.com/troisjs/trois.git synced 2024-11-24 04:12:02 +08:00
Code Issues Projects Releases Wiki Activity

wip

Browse Source
This commit is contained in:
Kevin Levron 2020-09-19 12:18:55 +02:00
parent af4859fb0c
commit 0e21aeaf28
4 changed files with 5 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/Test1.vue
View File

@ -1,10 +1,10 @@
<template> <template>
<Renderer ref="renderer"> <Renderer ref="renderer">
<Camera :position="{ z: 100 }"></Camera> <Camera :position="{ z: 10 }"></Camera>
<LambertMaterial id="material"></LambertMaterial> <LambertMaterial id="material"></LambertMaterial>
<Scene> <Scene>
<PointLight :position="{ y: 50, z: 50 }"></PointLight> <PointLight :position="{ y: 50, z: 50 }"></PointLight>
<Box ref="box" :size="10" :rotation="{ y: Math.PI / 4, z: Math.PI / 4 }" material="material"></Box> <Box ref="box" :size="1" :rotation="{ y: Math.PI / 4, z: Math.PI / 4 }" material-id="material"></Box>
</Scene> </Scene>
</Renderer> </Renderer>
</template> </template>

2
src/components/Test2.vue
View File

@ -6,7 +6,7 @@
<AmbientLight color="#808080"></AmbientLight> <AmbientLight color="#808080"></AmbientLight>
<PointLight color="#ff6000"></PointLight> <PointLight color="#ff6000"></PointLight>
<PointLight ref="light" color="#0060ff" :intensity="0.5"></PointLight> <PointLight ref="light" color="#0060ff" :intensity="0.5"></PointLight>
<InstancedMesh ref="imesh" material="material" :count="NUM_INSTANCES"> <InstancedMesh ref="imesh" material-id="material" :count="NUM_INSTANCES">
<BoxGeometry :width="2" :height="2" :depth="10"></BoxGeometry> <BoxGeometry :width="2" :height="2" :depth="10"></BoxGeometry>
</InstancedMesh> </InstancedMesh>
</Scene> </Scene>

2
src/components/Test3.vue
View File

@ -5,7 +5,7 @@
<Scene> <Scene>
<SpotLight color="#ffffff" :intensity="0.5" :position="{ y: 150, z: 0 }" :cast-shadow="true" :shadow-map-size="{ width: 1024, height: 1024 }"></SpotLight> <SpotLight color="#ffffff" :intensity="0.5" :position="{ y: 150, z: 0 }" :cast-shadow="true" :shadow-map-size="{ width: 1024, height: 1024 }"></SpotLight>
<SpotLight color="#ff0000" :intensity="0.5" :position="{ y: -150, z: 0 }" :cast-shadow="true" :shadow-map-size="{ width: 1024, height: 1024 }"></SpotLight> <SpotLight color="#ff0000" :intensity="0.5" :position="{ y: -150, z: 0 }" :cast-shadow="true" :shadow-map-size="{ width: 1024, height: 1024 }"></SpotLight>
<InstancedMesh ref="imesh" material="material" :count="NUM_INSTANCES" :cast-shadow="true" :receive-shadow="true"> <InstancedMesh ref="imesh" material-id="material" :count="NUM_INSTANCES" :cast-shadow="true" :receive-shadow="true">
<SphereGeometry :radius="5"></SphereGeometry> <SphereGeometry :radius="5"></SphereGeometry>
</InstancedMesh> </InstancedMesh>
</Scene> </Scene>

3
src/components/Test4.vue
View File

@ -7,7 +7,7 @@
ref="text" ref="text"
text="TroisJS" text="TroisJS"
font-src="helvetiker_regular.typeface.json" font-src="helvetiker_regular.typeface.json"
material="material" material-id="material"
align="center" align="center"
@ready="anim" @ready="anim"
></Text> ></Text>
@ -19,7 +19,6 @@
export default { export default {
methods: { methods: {
anim() { anim() {
console.log('anim');
this.$refs.renderer.onBeforeRender(() => { this.$refs.renderer.onBeforeRender(() => {
this.$refs.text.mesh.rotation.x += 0.01; this.$refs.text.mesh.rotation.x += 0.01;
}); });