From d8e552200c0e4c6655518ac3e7e723a6827b58d6 Mon Sep 17 00:00:00 2001 From: Kevin Levron Date: Wed, 28 Apr 2021 19:02:25 +0200 Subject: [PATCH] BufferGeometry with buffer attributes prop --- src/geometries/Geometry.ts | 24 +++++++++++++++++++++--- src/geometries/index.ts | 2 ++ 2 files changed, 23 insertions(+), 3 deletions(-) diff --git a/src/geometries/Geometry.ts b/src/geometries/Geometry.ts index 5d4bd9c..00ecb74 100644 --- a/src/geometries/Geometry.ts +++ b/src/geometries/Geometry.ts @@ -1,5 +1,5 @@ -import { ComponentPropsOptions, defineComponent, watch } from 'vue' -import { BufferGeometry } from 'three' +import { ComponentPropsOptions, defineComponent, PropType, watch } from 'vue' +import { BufferAttribute, BufferGeometry } from 'three' import { MeshInjectionKey, MeshInterface } from '../meshes/Mesh' export interface GeometrySetupInterface { @@ -8,6 +8,13 @@ export interface GeometrySetupInterface { watchProps?: string[] } +export interface GeometryAttributeInterface { + name: string + array: ArrayLike + itemSize: number + normalized?: boolean +} + // function defaultSetup(): GeometryInterface { // const mesh = inject('mesh') as MeshInterface // const watchProps: string[] = [] @@ -19,6 +26,7 @@ const Geometry = defineComponent({ rotateX: Number, rotateY: Number, rotateZ: Number, + attributes: { type: Array as PropType>, default: () => ([]) }, }, // inject for sub components inject: { @@ -46,7 +54,17 @@ const Geometry = defineComponent({ this.geometry?.dispose() }, methods: { - createGeometry() {}, + createGeometry() { + const bufferAttributes: Record = {} + const geometry = new BufferGeometry() + this.attributes.forEach(attribute => { + if (attribute.name && attribute.itemSize && attribute.array) { + const bufferAttribute = bufferAttributes[attribute.name] = new BufferAttribute(attribute.array, attribute.itemSize, attribute.normalized) + geometry.setAttribute(attribute.name, bufferAttribute) + } + }) + this.geometry = geometry + }, rotateGeometry() { if (!this.geometry) return if (this.rotateX) this.geometry.rotateX(this.rotateX) diff --git a/src/geometries/index.ts b/src/geometries/index.ts index 646a49b..290e579 100644 --- a/src/geometries/index.ts +++ b/src/geometries/index.ts @@ -1,3 +1,5 @@ +export { default as BufferGeometry } from './Geometry' + export { default as BoxGeometry } from './BoxGeometry' export { default as CircleGeometry } from './CircleGeometry' export { default as ConeGeometry } from './ConeGeometry'