How to use the BoxBufferGeometry function from three
Find comprehensive JavaScript three.BoxBufferGeometry code examples handpicked from public code repositorys.
three.BoxBufferGeometry is a Three.js built-in class that generates a box-shaped buffer geometry.
GitHub: K3D-tools/K3D-jupyter
20 21 22 23 24 25 26 27 28 29
config.samples = config.samples || 512.0; config.gradient_step = config.gradient_step || 0.005; config.interpolation = typeof (config.interpolation) !== 'undefined' ? config.interpolation : true; const randomMul = typeof (window.randomMul) !== 'undefined' ? window.randomMul : 255.0; const geometry = new THREE.BoxBufferGeometry(1, 1, 1); const modelMatrix = new THREE.Matrix4(); const translation = new THREE.Vector3(); const rotation = new THREE.Quaternion(); const scale = new THREE.Vector3();
20 21 22 23 24 25 26 27 28 29
const sx = primitive.end.x - primitive.start.x const sy = primitive.end.y - primitive.start.y const sz = primitive.end.z - primitive.start.z const boxGeometry = new THREE.BoxBufferGeometry(sx, sy, sz, sx, sy, sz) boxGeometry.attributes.positionStart = boxGeometry.attributes.position.clone() const gridGeometry = GridBoxGeometry(boxGeometry, false) const grid = new THREE.LineSegments(gridGeometry, new THREE.LineBasicMaterial({ color }))
+ 11 other calls in file
How does three.BoxBufferGeometry work?
three.BoxBufferGeometry is a class in the Three.js library that creates a buffer geometry representing a box (cuboid) in 3D space, with each face made up of two triangles, each of which consists of three vertices. It can be customized with various properties such as width, height, depth, and number of segments, among others. The resulting geometry can be used to create a mesh object that can be added to a Three.js scene.
GitHub: kentywang/Agamari
![kentywang profile picture](/kentywang.png?size=40)
32 33 34 35 36 37 38 39 40 41
// Create THREE object based on initial data parameters let { type, parms, x, y, z } = this.initialData; switch (type) { case 'box': geometry = new THREE.BoxBufferGeometry( parms[0], parms[1], parms[2] ); material = new THREE.MeshPhongMaterial( {color: someColors[color], shading: THREE.FlatShading} ); shape = new CANNON.Box(new CANNON.Vec3(parms[0] / 2, parms[1] / 2, parms[2] / 2)); break; case 'moon':
56 57 58 59 60 61 62 63 64 65
); } drawCube (penAttributes, dimensions, position, rotation) { this._addObjectFromGeometry( new three.BoxBufferGeometry(dimensions[0], dimensions[1], dimensions[2]), position, rotation, penAttributes.color4f );
+ 3 other calls in file
Ai Example
1 2 3 4 5 6 7 8 9
// create a new box buffer geometry with width = 1, height = 1, depth = 1 const geometry = new THREE.BoxBufferGeometry(1, 1, 1); // create a new mesh with the geometry and a basic material const material = new THREE.MeshBasicMaterial({ color: 0x00ff00 }); const mesh = new THREE.Mesh(geometry, material); // add the mesh to the scene scene.add(mesh);
This example creates a new BoxBufferGeometry object with a width, height, and depth of 1. It then creates a Mesh object with the geometry and a basic green material, and adds it to the scene. The BoxBufferGeometry represents a box-shaped geometry, defined by a set of vertices and faces. The Buffer prefix in the name indicates that this geometry is stored in a buffer for improved performance.
GitHub: shaungt1/sketch-threejs
![shaungt1 profile picture](/shaungt1.png?size=40)
14 15 16 17 18 19 20 21 22 23
this.obj = this.createObj(); this.obj.rotation.set(0, 0.3 * Math.PI, 0); } createObj() { const geometry = new THREE.InstancedBufferGeometry(); const baseGeometry = new THREE.BoxBufferGeometry(40, 1, 10); geometry.copy(baseGeometry); const height = new THREE.InstancedBufferAttribute(new Float32Array(this.instances), 1); const offsetX = new THREE.InstancedBufferAttribute(new Float32Array(this.instances), 1);
GitHub: fagan2888/EuroGridLayer
![fagan2888 profile picture](/fagan2888.png?size=40)
69 70 71 72 73 74 75 76 77 78
pointCloud.geometry.boundingBox = null; const pointsContainer = new THREE.Object3D(); pointsContainer.add(pointCloud); viewer.scene.add(pointsContainer); /* var geometry = new THREE.BoxBufferGeometry( 1, 1, 1 ); geometry.translate( 0, 0.5, 0 ); var material = new THREE.MeshPhongMaterial( { color: 0xffffff, flatShading: true } ); for ( var i = 0; i < 500; i ++ ) { var mesh = new THREE.Mesh( geometry, material );
+ 9 other calls in file
GitHub: FAC-11/FACgame
![FAC-11 profile picture](/FAC-11.png?size=40)
4 5 6 7 8 9 10 11 12 13
OBJLoader(THREE); const MTLLoader = require('three-mtl-loader'); const getObj6 = () => { const obj6 = new THREE.Mesh( new THREE.BoxBufferGeometry(10, 10, 10), new THREE.MeshBasicMaterial({ color: 0xffff00, wireframe: false, }),
+ 3 other calls in file
233 234 235 236 237 238 239 240 241 242
this.renderer.domElement.className = 'space-droid__canvas'; this.renderer.domElement.style.opacity = 1; element.appendChild(this.renderer.domElement); // Sample box to fill our scene. const geometry = new THREE.BoxBufferGeometry(10, 10, 10); const material = new THREE.MeshLambertMaterial({ color: 0x00ffbb }); this.sampleMesh = new THREE.Mesh(geometry, material); this.sampleMesh.position.set(0, 0, 0); this.sampleMesh.rotation.set(0, 0, 0);
GitHub: KleoPetroff/storyboarder
![KleoPetroff profile picture](/KleoPetroff.png?size=40)
126 127 128 129 130 131 132 133 134 135
object.position.y = -0.03 return object } const wallsFactory = ({ width, height, length }) => { let geometry = new THREE.BoxBufferGeometry( width, height, length )
GitHub: JesungKoo/glb2usdz
![JesungKoo profile picture](/JesungKoo.png?size=40)
63 64 65 66 67 68 69 70 71
const legColor = 0x000000; const legPosX = (width - legT)/2; const legPosY = (length - legT)/2; const topGeo = new THREE.BoxBufferGeometry(width, topT, length); const topMat = new THREE.MeshStandardMaterial( { color: topColor } ); const top = new THREE.Mesh( topGeo, topMat ); top.position.set(0, height + topT/2, 0);
+ 3 other calls in file
18 19 20 21 22 23 24 25 26 27
this.intersectPoint = new THREE.Vector3(); this.intersectPoint2 = new THREE.Vector3(); var tempHand = new THREE.Mesh( new THREE.BoxBufferGeometry(0.1, 0.1, 0.1, 1, 1, 1), new THREE.MeshNormalMaterial() ); this.h1 = tempHand;
704 705 706 707 708 709 710 711 712
// reusable geometry var arrowGeometry = new THREE.CylinderBufferGeometry( 0, 0.05, 0.2, 12, 1, false); var scaleHandleGeometry = new THREE.BoxBufferGeometry( 0.125, 0.125, 0.125); var lineGeometry = new THREE.BufferGeometry( ); lineGeometry.addAttribute('position', new THREE.Float32BufferAttribute( [ 0, 0, 0, 1, 0, 0 ], 3 ) );
GitHub: audunsh/evince
116 117 118 119 120 121 122 123 124 125
this.camera.position.z = 2*Math.abs(this.box[2]); } let baseGeometry = new THREE.SphereBufferGeometry(.3); //let baseGeometry = new THREE.BoxBufferGeometry(1.0,1.0,1.0); let instancedGeometry = new THREE.InstancedBufferGeometry().copy(baseGeometry); let instanceCount = this.state.length; instancedGeometry.maxInstancedCount = instanceCount; //let material = new THREE.ShaderMaterial();
GitHub: ASLS-org/studio
1095 1096 1097 1098 1099 1100 1101 1102 1103 1104
} static prepareBoxHelperInstance() { let boxHelperGeometry = new THREE.BoxBufferGeometry(1, 1, 1); let boxHelperMaterial = new THREE.MeshBasicMaterial({ side: THREE.BackSide, wireframe: true, color: 'rgb(30, 69, 185)',
+ 3 other calls in file
381 382 383 384 385 386 387 388 389 390
var height = 4.2; var purine_width = 6.0; var pyrimidine_width = 3.6; var geometry;// = new THREE.BoxGeometry(1,1,1); if (nuc == 'A') geometry = new THREE.BoxBufferGeometry(height, purine_width, thickness); else if (nuc == 'C') geometry = new THREE.BoxBufferGeometry(height, pyrimidine_width, thickness); else if (nuc == 'G') geometry = new THREE.BoxBufferGeometry(height, purine_width, thickness);
+ 17 other calls in file
GitHub: zDawnING/MyLearnWebGL
![zDawnING profile picture](/zDawnING.png?size=40)
66 67 68 69 70 71 72 73 74 75
/** * 创建指定材质立方体 * @return {[type]} [description] */ const createCube = (material) => { let geometry = new THREE.BoxBufferGeometry( 5, 5, 5 ); return new THREE.Mesh(geometry, material); } /**
three.Vector3 is the most popular function in three (22341 examples)