correct orientation cube labeling #4

This commit is contained in:
Arno Kaimbacher 2021-05-06 14:58:12 +02:00
parent 2f3a0e7b92
commit 9781536e37
2 changed files with 78 additions and 51 deletions

View File

@ -1,41 +1,67 @@
import { BufferGeometry } from 'three/src/core/BufferGeometry';
import { Uint16BufferAttribute } from 'three/src/core/BufferAttribute';
import { Vector3 } from 'three/src/math/Vector3';
import { Float32BufferAttribute } from 'three/src/core/BufferAttribute';
class UpdatableBoxGeometry extends BufferGeometry {
faces;
vertices: Array<Vector3>;
indexArray: Array<number>;
uvs: Array<number>;
groupStart: number;
constructor(vertices: Array<Vector3>) {
// call parent constructor
super();
this.type = 'UpdatableBoxGeometry';
this.indexArray = new Array();
this.vertices = new Array();
this.buildPlane(0, vertices[0], vertices[1], vertices[5], vertices[4]); //y1
this.buildPlane(4, vertices[0], vertices[2], vertices[3], vertices[1]); //z1
this.buildPlane(8, vertices[0], vertices[4], vertices[6], vertices[2]); //x1
this.buildPlane(12, vertices[7], vertices[5], vertices[1], vertices[3]); //x2
this.buildPlane(16, vertices[7], vertices[3], vertices[2], vertices[6]); //y2
this.buildPlane(20, vertices[7], vertices[6], vertices[4], vertices[5]); //z2
this.uvs = [];
// helper variables for material index
this.groupStart = 0;
this.buildPlane(0, vertices[0], vertices[1], vertices[5], vertices[4], 0); //y1 south
this.buildPlane(4, vertices[0], vertices[2], vertices[3], vertices[1], 1); //z1 bottom
this.buildPlane(8, vertices[0], vertices[4], vertices[6], vertices[2], 2); //x1 east
this.buildPlane(12, vertices[7], vertices[5], vertices[1], vertices[3], 3); //x2 west
this.buildPlane(16, vertices[7], vertices[3], vertices[2], vertices[6], 4); //y2 nort
this.buildPlane(20, vertices[7], vertices[6], vertices[4], vertices[5], 5); //z2
this.setFromPoints(this.vertices);
let indices = new Uint16BufferAttribute(this.indexArray, 1);//.setDynamic(true);
this.setIndex(indices);
this.computeVertexNormals();
this.setAttribute('uv', new Float32BufferAttribute(this.uvs, 2));
}
buildPlane(i, v0, v1, v2, v3) {
// let frontFaceGeometry = new PlaneGeometry(v0, v1, v2, v3);
// let frontFaceMesh = new Mesh(frontFaceGeometry, material.Invisible);
// frontFaceMesh.axis = axis;
this.vertices.push(v0, v1, v2, v3);
buildPlane(i, v0, v1, v2, v3, materialIndex) {
let groupCount = 0;
this.indexArray.push(i, i +1, i + 2, i, i +2, i+3);
this.vertices.push(v0, v1, v2, v3);
this.indexArray.push(i, i + 1, i + 2, i, i + 2, i + 3);
// let indexArray = [0, 1, 2, 0, 2, 3];
groupCount += 6;
if (materialIndex == 2) { // east
this.uvs.push(1, 0, 1, 1, 0, 1, 0, 0);
} else if (materialIndex == 3) { //west
this.uvs.push(1, 1, 0, 1, 0, 0, 1, 0);
} else if (materialIndex == 4) { //north
this.uvs.push(0, 1, 0, 0, 1, 0, 1, 1);
} else if (materialIndex == 5) { //top
this.uvs.push(1, 1, 0, 1, 0, 0, 1, 0);
} else {
this.uvs.push(0, 0, 1, 0, 1, 1, 0, 1);
}
// add a group to the geometry. this will ensure multi material support
this.addGroup(this.groupStart, groupCount, materialIndex);
// calculate new start value for groups
this.groupStart += groupCount;
}
update() {

View File

@ -9,6 +9,7 @@ import { WebGLRenderer } from 'three/src/renderers/WebGLRenderer';
import { Scene } from 'three/src/scenes/Scene';
import { PerspectiveCamera } from 'three/src/cameras/PerspectiveCamera';
import { BoxGeometry } from '../core/BoxGeometry';
import { UpdatableBoxGeometry } from '../clip/UpdatableBoxGeometry';
import { Mesh } from 'three/src/objects/Mesh';
import * as material from '../clip/material';
import { Texture } from 'three/src/textures/Texture';
@ -130,6 +131,7 @@ export class NorthArrow extends Control {
let eastTexture = this._makeTextTexture("E", 0.6, 'rgba(0,0,0,1)');
let eastMaterial = new MeshBasicMaterial({
transparent: true,
// color: 0x6f6f6f,
side: DoubleSide,
map: eastTexture,
// wireframe: true
@ -159,22 +161,21 @@ export class NorthArrow extends Control {
map: topTexture
});
// var mesh1 = new Mesh(
// new PlaneGeometry(5, 5),
// material1
// );
// // const yScale = this.textHeight * lines.length + border[1] * 2 + padding[1] * 2;
// // mesh1.scale.set(yScale * canvas.width / canvas.height, yScale, 0);
//add orientation box:
let vertices = [
new Vector3(0, 0, 0), new Vector3(5, 0, 0),
new Vector3(0, 5, 0), new Vector3(5, 5, 0),
new Vector3(0, 0, 5), new Vector3(5, 0, 5),
new Vector3(0, 5, 5), new Vector3(5, 5, 5)
];
this.boxGeometry = new UpdatableBoxGeometry(vertices);
this.boxMesh = new Mesh(this.boxGeometry,
[southMaterial, material.BoxBackFace, eastMaterial, westMaterial, northMaterial, topMaterial]);
// mesh1.position.set(2.5, 2.5, 5.1);
// this.objectGroup.add(mesh1);
//add box:
this.boxGeometry = new BoxGeometry(5, 5, 5);
this.boxMesh = new Mesh(this.boxGeometry,
[eastMaterial, westMaterial, northMaterial, southMaterial, topMaterial, material.BoxBackFace]);
// material.BoxBackFace.wireframe = true;
this.boxMesh.position.set(2.5, 2.5, 2.5);
// this.boxGeometry = new BoxGeometry(5, 5, 5);
// this.boxMesh = new Mesh(this.boxGeometry,
// [eastMaterial, westMaterial, northMaterial, southMaterial, topMaterial, material.BoxBackFace]);
// this.boxMesh.position.set(2.5, 2.5, 2.5);
this.objectGroup.add(this.boxMesh);
if (app_scene) {