From 5224c2eababf5d8303d17ba00d21c43c3a2b96aa Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Sat, 1 Dec 2018 00:51:59 +0100 Subject: displaying points a bit --- site/assets/test/face.html | 106 +++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 106 insertions(+) create mode 100644 site/assets/test/face.html (limited to 'site/assets/test/face.html') diff --git a/site/assets/test/face.html b/site/assets/test/face.html new file mode 100644 index 00000000..241e7348 --- /dev/null +++ b/site/assets/test/face.html @@ -0,0 +1,106 @@ + + + +face points + + + + + +
+ + + + + \ No newline at end of file -- cgit v1.2.3-70-g09d2 From a73d258bf8c67ce1f37b91af5a7927fb5a1209ef Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Sat, 1 Dec 2018 19:55:31 +0100 Subject: meshline on face --- site/assets/js/vendor/three.meshline.js | 486 ++++++++++++++++++++++++++++++++ site/assets/test/face.html | 246 +++++++++++----- 2 files changed, 669 insertions(+), 63 deletions(-) create mode 100644 site/assets/js/vendor/three.meshline.js (limited to 'site/assets/test/face.html') diff --git a/site/assets/js/vendor/three.meshline.js b/site/assets/js/vendor/three.meshline.js new file mode 100644 index 00000000..c6e998e3 --- /dev/null +++ b/site/assets/js/vendor/three.meshline.js @@ -0,0 +1,486 @@ +;(function() { + +"use strict"; + +var root = this + +var has_require = typeof require !== 'undefined' + +var THREE = root.THREE || has_require && require('three') +if( !THREE ) + throw new Error( 'MeshLine requires three.js' ) + +function MeshLine() { + + this.positions = []; + + this.previous = []; + this.next = []; + this.side = []; + this.width = []; + this.indices_array = []; + this.uvs = []; + this.counters = []; + this.geometry = new THREE.BufferGeometry(); + + this.widthCallback = null; + +} + +MeshLine.prototype.setGeometry = function( g, c ) { + + this.widthCallback = c; + + this.positions = []; + this.counters = []; + + if( g instanceof THREE.Geometry ) { + for( var j = 0; j < g.vertices.length; j++ ) { + var v = g.vertices[ j ]; + var c = j/g.vertices.length; + this.positions.push( v.x, v.y, v.z ); + this.positions.push( v.x, v.y, v.z ); + this.counters.push(c); + this.counters.push(c); + } + } + + if( g instanceof THREE.BufferGeometry ) { + // read attribute positions ? + } + + if( g instanceof Float32Array || g instanceof Array ) { + for( var j = 0; j < g.length; j += 3 ) { + var c = j/g.length; + this.positions.push( g[ j ], g[ j + 1 ], g[ j + 2 ] ); + this.positions.push( g[ j ], g[ j + 1 ], g[ j + 2 ] ); + this.counters.push(c); + this.counters.push(c); + } + } + + this.process(); + +} + +MeshLine.prototype.compareV3 = function( a, b ) { + + var aa = a * 6; + var ab = b * 6; + return ( this.positions[ aa ] === this.positions[ ab ] ) && ( this.positions[ aa + 1 ] === this.positions[ ab + 1 ] ) && ( this.positions[ aa + 2 ] === this.positions[ ab + 2 ] ); + +} + +MeshLine.prototype.copyV3 = function( a ) { + + var aa = a * 6; + return [ this.positions[ aa ], this.positions[ aa + 1 ], this.positions[ aa + 2 ] ]; + +} + +MeshLine.prototype.process = function() { + + var l = this.positions.length / 6; + + this.previous = []; + this.next = []; + this.side = []; + this.width = []; + this.indices_array = []; + this.uvs = []; + + for( var j = 0; j < l; j++ ) { + this.side.push( 1 ); + this.side.push( -1 ); + } + + var w; + for( var j = 0; j < l; j++ ) { + if( this.widthCallback ) w = this.widthCallback( j / ( l -1 ) ); + else w = 1; + this.width.push( w ); + this.width.push( w ); + } + + for( var j = 0; j < l; j++ ) { + this.uvs.push( j / ( l - 1 ), 0 ); + this.uvs.push( j / ( l - 1 ), 1 ); + } + + var v; + + if( this.compareV3( 0, l - 1 ) ){ + v = this.copyV3( l - 2 ); + } else { + v = this.copyV3( 0 ); + } + this.previous.push( v[ 0 ], v[ 1 ], v[ 2 ] ); + this.previous.push( v[ 0 ], v[ 1 ], v[ 2 ] ); + for( var j = 0; j < l - 1; j++ ) { + v = this.copyV3( j ); + this.previous.push( v[ 0 ], v[ 1 ], v[ 2 ] ); + this.previous.push( v[ 0 ], v[ 1 ], v[ 2 ] ); + } + + for( var j = 1; j < l; j++ ) { + v = this.copyV3( j ); + this.next.push( v[ 0 ], v[ 1 ], v[ 2 ] ); + this.next.push( v[ 0 ], v[ 1 ], v[ 2 ] ); + } + + if( this.compareV3( l - 1, 0 ) ){ + v = this.copyV3( 1 ); + } else { + v = this.copyV3( l - 1 ); + } + this.next.push( v[ 0 ], v[ 1 ], v[ 2 ] ); + this.next.push( v[ 0 ], v[ 1 ], v[ 2 ] ); + + for( var j = 0; j < l - 1; j++ ) { + var n = j * 2; + this.indices_array.push( n, n + 1, n + 2 ); + this.indices_array.push( n + 2, n + 1, n + 3 ); + } + + if (!this.attributes) { + this.attributes = { + position: new THREE.BufferAttribute( new Float32Array( this.positions ), 3 ), + previous: new THREE.BufferAttribute( new Float32Array( this.previous ), 3 ), + next: new THREE.BufferAttribute( new Float32Array( this.next ), 3 ), + side: new THREE.BufferAttribute( new Float32Array( this.side ), 1 ), + width: new THREE.BufferAttribute( new Float32Array( this.width ), 1 ), + uv: new THREE.BufferAttribute( new Float32Array( this.uvs ), 2 ), + index: new THREE.BufferAttribute( new Uint16Array( this.indices_array ), 1 ), + counters: new THREE.BufferAttribute( new Float32Array( this.counters ), 1 ) + } + } else { + this.attributes.position.copyArray(new Float32Array(this.positions)); + this.attributes.position.needsUpdate = true; + this.attributes.previous.copyArray(new Float32Array(this.previous)); + this.attributes.previous.needsUpdate = true; + this.attributes.next.copyArray(new Float32Array(this.next)); + this.attributes.next.needsUpdate = true; + this.attributes.side.copyArray(new Float32Array(this.side)); + this.attributes.side.needsUpdate = true; + this.attributes.width.copyArray(new Float32Array(this.width)); + this.attributes.width.needsUpdate = true; + this.attributes.uv.copyArray(new Float32Array(this.uvs)); + this.attributes.uv.needsUpdate = true; + this.attributes.index.copyArray(new Uint16Array(this.indices_array)); + this.attributes.index.needsUpdate = true; + } + + this.geometry.addAttribute( 'position', this.attributes.position ); + this.geometry.addAttribute( 'previous', this.attributes.previous ); + this.geometry.addAttribute( 'next', this.attributes.next ); + this.geometry.addAttribute( 'side', this.attributes.side ); + this.geometry.addAttribute( 'width', this.attributes.width ); + this.geometry.addAttribute( 'uv', this.attributes.uv ); + this.geometry.addAttribute( 'counters', this.attributes.counters ); + + this.geometry.setIndex( this.attributes.index ); + +} + +function memcpy (src, srcOffset, dst, dstOffset, length) { + var i + + src = src.subarray || src.slice ? src : src.buffer + dst = dst.subarray || dst.slice ? dst : dst.buffer + + src = srcOffset ? src.subarray ? + src.subarray(srcOffset, length && srcOffset + length) : + src.slice(srcOffset, length && srcOffset + length) : src + + if (dst.set) { + dst.set(src, dstOffset) + } else { + for (i=0; i + face points
+
+ -- cgit v1.2.3-70-g09d2 From 6062728b63e6496709f2e552542c220f4f16e79c Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Sat, 1 Dec 2018 19:56:23 +0100 Subject: meshline on face --- site/assets/test/face.html | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) (limited to 'site/assets/test/face.html') diff --git a/site/assets/test/face.html b/site/assets/test/face.html index 27e6c0c7..598a5891 100644 --- a/site/assets/test/face.html +++ b/site/assets/test/face.html @@ -217,7 +217,8 @@ function animate(t) { mouseTarget.x += (mouse.x - mouseTarget.x) * 0.1 mouseTarget.y += (mouse.y - mouseTarget.y) * 0.1 scene.rotation.x = (mouseTarget.y - 0.5) * Math.PI / 2 - scene.rotation.y = (mouseTarget.x - 0.5) * Math.PI + // scene.rotation.y = (mouseTarget.x - 0.5) * Math.PI + scene.rotation.y += 0.01 last_t = t } -- cgit v1.2.3-70-g09d2