geolba/GeotiefExplore
2
1
Fork 0
Code Issues 7 Pull Requests Projects 1 Releases Wiki Activity

correct orientation cube labeling #4

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
src/js/clip/UpdatableBoxGeometry.ts
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>) {
super();
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() {

69
src/js/controls/NorthArrow.js
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';
@ -112,7 +113,7 @@ export class NorthArrow extends Control {
// let zTo = new Vector3(from.x, from.y, from.z + 1);
// let zDirection = zTo.clone().sub(from);
this.objectGroup.add(new ArrowHelper(zTo, from, size, 0x6b716f, headLength, headWidth)); //8 is the length, Gray = z; 20 and 10 are head length and width
// let spritey = this._makeTextSprite(
// "top",
// { fontsize: 32, backgroundColor: { r: 255, g: 100, b: 100, a: 1 } }
@ -125,56 +126,56 @@ export class NorthArrow extends Control {
// myText.position.set(2.5, 2.5, 6);
// this.objectGroup.add(myText);
let eastTexture = this._makeTextTexture("E", 0.6, 'rgba(0,0,0,1)');
let eastMaterial = new MeshBasicMaterial({
let eastMaterial = new MeshBasicMaterial({
transparent: true,
// color: 0x6f6f6f,
side: DoubleSide,
map: eastTexture,
// wireframe: true
});
let westTexture = this._makeTextTexture("W", 0.6, 'rgba(0,0,0,1)');
let westMaterial = new MeshBasicMaterial({
let westMaterial = new MeshBasicMaterial({
transparent: true,
side: DoubleSide,
map: westTexture
});
let northTexture = this._makeTextTexture("N", 0.6, 'rgba(0,0,0,1)');
let northMaterial = new MeshBasicMaterial({
let northMaterial = new MeshBasicMaterial({
transparent: true,
side: DoubleSide,
map: northTexture
});
let southTexture = this._makeTextTexture("S", 0.6, 'rgba(0,0,0,1)');
let southMaterial = new MeshBasicMaterial({
let southMaterial = new MeshBasicMaterial({
transparent: true,
side: DoubleSide,
map: southTexture
map: southTexture
});
let topTexture = this._makeTextTexture("top", 0.6, 'rgba(0,0,0,1)');
let topMaterial = new MeshBasicMaterial({
let topMaterial = new MeshBasicMaterial({
transparent: true,
side: DoubleSide,
map: topTexture
});
});
//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]);
// 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);
// 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) {
@ -182,7 +183,7 @@ export class NorthArrow extends Control {
}
}
_makeTextTexture(message, textHeight = 0.6, color = 'rgba(0,0,0,1)') {
_makeTextTexture(message, textHeight = 0.6, color = 'rgba(0,0,0,1)') {
let text = `${message}`;
// this.textHeight = textHeight;
// this.color = color;
@ -264,21 +265,21 @@ export class NorthArrow extends Control {
if (drawTextStroke) {
ctx.lineWidth = strokeWidth * fontSize / 10;
ctx.strokeStyle = strokeColor;
}
}
lines.forEach((line, index) => {
const lineX = (innerWidth - ctx.measureText(line).width) / 2;
const lineY = (index + 1) * fontSize;
drawTextStroke == true && ctx.strokeText(line, lineX, lineY);
ctx.fillText(line, lineX, lineY);
});
});
@ -287,7 +288,7 @@ export class NorthArrow extends Control {
texture.needsUpdate = true;
return texture;
}
}
_buildLabels() {