Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Web-ECS/do-three

Repository files navigation

Data-oriented Three.js Integrations

A library to help integrate Three.js with data-oriented design structures.

Features

Supported Three.js data structures so far:

Vector2 Quaternion
Vector3 Matrix3
Vector4 Matrix4

Structure of Arrays Example

import assert from 'assert'
import { proxifyVector3 } from '@webecs/dod-three'
import * as THREE from 'three'

const n = 100
const PositionSoA = {
  x: Float32Array(n),
  y: Float32Array(n),
  z: Float32Array(n),
}


const id = 0
const mesh = new THREE.Mesh(
  new THREE.BoxGeometry( 200, 200, 200 ),
  new THREE.MeshBasicMaterial( { wireframe: true } )
)

proxifyVector3(mesh.position, PositionSoA, id)

mesh.position.x = 1
mesh.position.y = 2
mesh.position.z = 3

assert(PositionSoA.x[id] === 1) // true
assert(PositionSoA.y[id] === 2) // true
assert(PositionSoA.z[id] === 3) // true

PositionSoA.x[id] = 4
PositionSoA.y[id] = 5
PositionSoA.z[id] = 6

assert(mesh.position.x === 4) // true
assert(mesh.position.y === 5) // true
assert(mesh.position.z === 6) // true

Array of Arrays Example

import assert from 'assert'
import { proxifyVector3 } from '@webecs/dod-three'
import * as THREE from 'three'

const n = 100
const stride = 3
const PositionAoA = Array(n)
  .fill(new Float32Array(n*stride))
  .map((store,i) => store.subarray(i*stride, i*stride+stride))

const id = 0
const mesh = new THREE.Mesh(
  new THREE.BoxGeometry( 200, 200, 200 ),
  new THREE.MeshBasicMaterial( { wireframe: true } )
)

proxifyVector3(mesh.position, PositionAoA[id])

mesh.position.x = 1
mesh.position.y = 2
mesh.position.z = 3

assert(PositionAoA[id][0] === 1) // true
assert(PositionAoA[id][1] === 2) // true
assert(PositionAoA[id][2] === 3) // true

PositionAoA[id][0] = 4
PositionAoA[id][1] = 5
PositionAoA[id][2] = 6

assert(mesh.position.x === 4) // true
assert(mesh.position.y === 5) // true
assert(mesh.position.z === 6) // true

Releases

No releases published

Packages

No packages published
Morty Proxy This is a proxified and sanitized view of the page, visit original site.