From 8a2d874290f7c8d2d5f7fd37f676c777b7592be1 Mon Sep 17 00:00:00 2001 From: Kevin Levron Date: Wed, 21 Apr 2021 16:03:31 +0200 Subject: [PATCH] instancedmesh --- src/meshes/InstancedMesh.js | 64 ----------------------------------- src/meshes/InstancedMesh.ts | 67 +++++++++++++++++++++++++++++++++++++ 2 files changed, 67 insertions(+), 64 deletions(-) delete mode 100644 src/meshes/InstancedMesh.js create mode 100644 src/meshes/InstancedMesh.ts diff --git a/src/meshes/InstancedMesh.js b/src/meshes/InstancedMesh.js deleted file mode 100644 index 1172d40..0000000 --- a/src/meshes/InstancedMesh.js +++ /dev/null @@ -1,64 +0,0 @@ -import { defineComponent } from 'vue'; -import { InstancedMesh } from 'three'; -import Object3D from '../core/Object3D'; -import { bindProp } from '../tools'; -import { pointerProps } from './Mesh'; - -export default defineComponent({ - extends: Object3D, - props: { - castShadow: Boolean, - receiveShadow: Boolean, - count: Number, - ...pointerProps, - }, - provide() { - return { - mesh: this, - }; - }, - beforeMount() { - if (!this.$slots.default) { - console.error('Missing Geometry'); - } - }, - mounted() { - this.initMesh(); - }, - methods: { - initMesh() { - this.mesh = new InstancedMesh(this.geometry, this.material, this.count); - this.mesh.component = this; - - bindProp(this, 'castShadow', this.mesh); - bindProp(this, 'receiveShadow', this.mesh); - - if (this.onPointerEnter || - this.onPointerOver || - this.onPointerMove || - this.onPointerLeave || - this.onPointerDown || - this.onPointerUp || - this.onClick) { - this.three.addIntersectObject(this.mesh); - } - - this.initObject3D(this.mesh); - }, - setGeometry(geometry) { - this.geometry = geometry; - if (this.mesh) this.mesh.geometry = geometry; - }, - setMaterial(material) { - this.material = material; - this.material.instancingColor = true; - if (this.mesh) this.mesh.material = material; - }, - }, - unmounted() { - if (this.mesh) { - this.three.removeIntersectObject(this.mesh); - } - }, - __hmrId: 'InstancedMesh', -}); diff --git a/src/meshes/InstancedMesh.ts b/src/meshes/InstancedMesh.ts new file mode 100644 index 0000000..39da6db --- /dev/null +++ b/src/meshes/InstancedMesh.ts @@ -0,0 +1,67 @@ +import { defineComponent } from 'vue' +import { BufferGeometry, InstancedMesh, Material } from 'three' +import Object3D, { object3DSetup } from '../core/Object3D' +import { bindProp } from '../tools' +import { MeshSetupInterface, pointerProps } from './Mesh' + +export default defineComponent({ + extends: Object3D, + props: { + castShadow: Boolean, + receiveShadow: Boolean, + count: { type: Number, required: true }, + ...pointerProps, + }, + setup(): MeshSetupInterface { + return object3DSetup() + }, + provide() { + return { + mesh: this, + } + }, + mounted() { + if (!this.$slots.default) { + console.error('Missing geometry and material') + return + } + this.initMesh() + }, + methods: { + initMesh() { + console.log(this.material) + if (!this.geometry || !this.material) return false + this.mesh = new InstancedMesh(this.geometry, this.material, this.count) + this.mesh.userData.component = this + + bindProp(this, 'castShadow', this.mesh) + bindProp(this, 'receiveShadow', this.mesh) + + if (this.onPointerEnter || + this.onPointerOver || + this.onPointerMove || + this.onPointerLeave || + this.onPointerDown || + this.onPointerUp || + this.onClick) { + this.three.addIntersectObject(this.mesh) + } + + this.initObject3D(this.mesh) + }, + setGeometry(geometry: BufferGeometry) { + this.geometry = geometry + if (this.mesh) this.mesh.geometry = geometry + }, + setMaterial(material: Material) { + this.material = material + if (this.mesh) this.mesh.material = material + }, + }, + unmounted() { + if (this.mesh) { + this.three.removeIntersectObject(this.mesh) + } + }, + __hmrId: 'InstancedMesh', +})