mirror of
https://github.com/troisjs/trois.git
synced 2024-11-24 04:12:02 +08:00
wip
This commit is contained in:
parent
27c22b4e20
commit
eb74b5b54f
21
README.md
21
README.md
@ -57,14 +57,29 @@ I will try to rewrite some of my [WebGL demos](https://codepen.io/collection/AG
|
|||||||
I first made a simple *Proof of Concept*, take a look at [Test1.vue](/src/components/Test1.vue) :
|
I first made a simple *Proof of Concept*, take a look at [Test1.vue](/src/components/Test1.vue) :
|
||||||
|
|
||||||
```html
|
```html
|
||||||
<Renderer ref="renderer">
|
<template>
|
||||||
|
<Renderer ref="renderer">
|
||||||
<Camera :position="{ z: 100 }"></Camera>
|
<Camera :position="{ z: 100 }"></Camera>
|
||||||
<LambertMaterial id="material"></LambertMaterial>
|
<LambertMaterial id="material"></LambertMaterial>
|
||||||
<Scene>
|
<Scene>
|
||||||
<PointLight :position="{ x: 0, 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="10" :rotation="{ y: Math.PI / 4, z: Math.PI / 4 }" material="material"></Box>
|
||||||
</Scene>
|
</Scene>
|
||||||
</Renderer>
|
</Renderer>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
mounted() {
|
||||||
|
const renderer = this.$refs.renderer;
|
||||||
|
const box = this.$refs.box.mesh;
|
||||||
|
|
||||||
|
renderer.onBeforeRender(() => {
|
||||||
|
box.rotation.x += 0.01;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
```
|
```
|
||||||
|
|
||||||
## InstancedMesh
|
## InstancedMesh
|
||||||
|
42
src/plugin.js
Normal file
42
src/plugin.js
Normal file
@ -0,0 +1,42 @@
|
|||||||
|
import * as TROIS from './index.js';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
install: (app) => {
|
||||||
|
const comps = [
|
||||||
|
'Camera',
|
||||||
|
'PerspectiveCamera',
|
||||||
|
'Renderer',
|
||||||
|
'Scene',
|
||||||
|
|
||||||
|
'BoxGeometry',
|
||||||
|
'SphereGeometry',
|
||||||
|
|
||||||
|
'AmbientLight',
|
||||||
|
'PointLight',
|
||||||
|
'SpotLight',
|
||||||
|
|
||||||
|
'BasicMaterial',
|
||||||
|
'LambertMaterial',
|
||||||
|
'PhongMaterial',
|
||||||
|
'PhysicalMaterial',
|
||||||
|
'ShaderMaterial',
|
||||||
|
'StandardMaterial',
|
||||||
|
'SubSurfaceMaterial',
|
||||||
|
|
||||||
|
'Box',
|
||||||
|
'InstancedMesh',
|
||||||
|
'Plane',
|
||||||
|
'Sphere',
|
||||||
|
'Text',
|
||||||
|
|
||||||
|
'BokehPass',
|
||||||
|
'EffectComposer',
|
||||||
|
'RenderPass',
|
||||||
|
'UnrealBloomPass',
|
||||||
|
];
|
||||||
|
|
||||||
|
comps.forEach(comp => {
|
||||||
|
app.component(comp, TROIS[comp]);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
};
|
Loading…
Reference in New Issue
Block a user