Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Geometry: Move computeLineDistance() to Line/LineSegments #13147

Merged
merged 9 commits into from Feb 9, 2018
Merged

Geometry: Move computeLineDistance() to Line/LineSegments #13147

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
4b82ecc
Geometry: Move computeLineDistance() to Line
Mugen87 Jan 21, 2018
c0e5d25
Exampels: Fix copy/paste error
Mugen87 Jan 21, 2018
e463b8c
Examples: Improved webgl_lines_dashed.html
Mugen87 Jan 21, 2018
0286198
Line: Handle indexed geometry more gracefully
Mugen87 Jan 21, 2018
2fbec23
LineSegments: Added .computeLineDistances()
Mugen87 Jan 21, 2018
0ec8b93
LineSegments: Fix log message
Mugen87 Jan 21, 2018
e1391a9
Line/LineSegments: Refactoring
Mugen87 Jan 21, 2018
ccfee63
Docs: Improve description for Line.computeLineDistances()
Mugen87 Jan 21, 2018
aeb4865
Tests: Clean up
Mugen87 Jan 22, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
6 changes: 1 addition & 5 deletions docs/api/core/Geometry.html
View file
Open in desktop
Expand Up @@ -107,8 +107,7 @@ <h3>[property:Boolean isGeometry]</h3>
<h3>[property:array lineDistances]</h3>
<div>
An array containing distances between vertices for Line geometries.
This is required for [page:LineSegments] / [page:LineDashedMaterial] to render correctly.
Line distances can be generated automatically with [page:.computeLineDistances].
This is required for [page:LineDashedMaterial] to render correctly.
</div>

<h3>[property:Array morphTargets]</h3>
Expand Down Expand Up @@ -242,9 +241,6 @@ <h3>[method:null computeFaceNormals]()</h3>
<h3>[method:null computeFlatVertexNormals]()</h3>
<div>Computes flat [page:Face3.vertexNormals vertex normals]. Sets the vertex normal of each vertex of each face to be the same as the face's normal.</div>

<h3>[method:null computeLineDistances]()</h3>
<div>Compute [page:.lineDistances].</div>

<h3>[method:null computeMorphNormals]()</h3>
<div>Computes [page:.morphNormals].</div>

Expand Down
6 changes: 6 additions & 0 deletions docs/api/deprecated/DeprecatedList.html
View file
Open in desktop
Expand Up @@ -153,6 +153,12 @@ <h3>[page:SplineCurve3]</h3>

<h2>Geometry</h2>

<div>
Geometry.computeTangents() has been removed.<br /><br />

Geometry.computeLineDistances() has been removed. Use [page:Line.computeLineDistances] instead.<br /><br />
</div>

<h3>[page:BufferGeometry]</h3>
<div>
BufferGeometry.addIndex has been renamed to [page:BufferGeometry.setIndex].<br /><br />
Expand Down
5 changes: 5 additions & 0 deletions docs/api/objects/Line.html
View file
Open in desktop
Expand Up @@ -74,6 +74,11 @@ <h3>[property:Material material]</h3>
<h2>Methods</h2>
<div>See the base [page:Object3D] class for common methods.</div>

<h3>[method:Line computeLineDistances]()</h3>
<div>
Computes an array of distance values which are necessary for [page:LineDashedMaterial]. For each vertex in the geometry, the method calculates the cumulative length from the current point to the very beginning of the line.
</div>

<h3>[method:Array raycast]( [page:Raycaster raycaster], [page:Array intersects] )</h3>
<div>
Get intersections between a casted [page:Ray] and this Line.
Expand Down
19 changes: 3 additions & 16 deletions examples/canvas_lines_dashed.html
View file
Open in desktop
Expand Up @@ -49,8 +49,7 @@
var objects = [];


var WIDTH = window.innerWidth,
HEIGHT = window.innerHeight;
var WIDTH = window.innerWidth, HEIGHT = window.innerHeight;

init();
animate();
Expand All @@ -63,28 +62,17 @@
scene = new THREE.Scene();
scene.background = new THREE.Color( 0x111111 );

root = new THREE.Object3D();

var subdivisions = 6;
var recursion = 1;

var points = hilbert3D( new THREE.Vector3( 0,0,0 ), 25.0, recursion, 0, 1, 2, 3, 4, 5, 6, 7 );

var spline = new THREE.CatmullRomCurve3( points );
var geometrySpline = new THREE.Geometry();

for ( var i = 0; i < points.length * subdivisions; i ++ ) {

var t = i / ( points.length * subdivisions );
geometrySpline.vertices[ i ] = spline.getPoint( t );

}
var samples = spline.getPoints( points.length * subdivisions );
var geometrySpline = new THREE.Geometry().setFromPoints( samples );

var geometryCube = cube( 50 );

geometryCube.computeLineDistances();
geometrySpline.computeLineDistances();

var object = new THREE.Line( geometrySpline, new THREE.LineDashedMaterial( { color: 0xffffff, dashSize: 1, gapSize: 0.5 } ) );

objects.push( object );
Expand Down Expand Up @@ -186,7 +174,6 @@

var object = objects[ i ];

//object.rotation.x = 0.25 * time * ( i%2 == 1 ? 1 : -1);
object.rotation.x = 0.25 * time;
object.rotation.y = 0.25 * time;

Expand Down
103 changes: 48 additions & 55 deletions examples/webgl_lines_dashed.html
View file
Open in desktop
Expand Up @@ -45,9 +45,7 @@
var renderer, scene, camera, stats;
var objects = [];


var WIDTH = window.innerWidth,
HEIGHT = window.innerHeight;
var WIDTH = window.innerWidth, HEIGHT = window.innerHeight;

init();
animate();
Expand All @@ -61,37 +59,28 @@
scene.background = new THREE.Color( 0x111111 );
scene.fog = new THREE.Fog( 0x111111, 150, 200 );

root = new THREE.Object3D();

var subdivisions = 6;
var recursion = 1;

var points = hilbert3D( new THREE.Vector3( 0,0,0 ), 25.0, recursion, 0, 1, 2, 3, 4, 5, 6, 7 );

var points = hilbert3D( new THREE.Vector3( 0, 0, 0 ), 25.0, recursion, 0, 1, 2, 3, 4, 5, 6, 7 );
var spline = new THREE.CatmullRomCurve3( points );
var geometrySpline = new THREE.Geometry();

for ( var i = 0; i < points.length * subdivisions; i ++ ) {
var samples = spline.getPoints( points.length * subdivisions );
var geometrySpline = new THREE.Geometry().setFromPoints( samples );

var t = i / ( points.length * subdivisions );
geometrySpline.vertices[ i ] = spline.getPoint( t );
var line = new THREE.Line( geometrySpline, new THREE.LineDashedMaterial( { color: 0xffffff, dashSize: 1, gapSize: 0.5 } ) );
line.computeLineDistances();

}
objects.push( line );
scene.add( line );

var geometryCube = cube( 50 );

geometryCube.computeLineDistances();
geometrySpline.computeLineDistances();

var object = new THREE.Line( geometrySpline, new THREE.LineDashedMaterial( { color: 0xffffff, dashSize: 1, gapSize: 0.5 } ) );

objects.push( object );
scene.add( object );
var lineSegments = new THREE.LineSegments( geometryCube, new THREE.LineDashedMaterial( { color: 0xffaa00, dashSize: 3, gapSize: 1, linewidth: 2 } ) );
lineSegments.computeLineDistances();

var object = new THREE.LineSegments( geometryCube, new THREE.LineDashedMaterial( { color: 0xffaa00, dashSize: 3, gapSize: 1, linewidth: 2 } ) );

objects.push( object );
scene.add( object );
objects.push( lineSegments );
scene.add( lineSegments );

renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.setPixelRatio( window.devicePixelRatio );
Expand All @@ -113,47 +102,49 @@

var h = size * 0.5;

var geometry = new THREE.Geometry();

geometry.vertices.push(
new THREE.Vector3( -h, -h, -h ),
new THREE.Vector3( -h, h, -h ),
var geometry = new THREE.BufferGeometry();
var position = [];

new THREE.Vector3( -h, h, -h ),
new THREE.Vector3( h, h, -h ),
position.push(
-h, -h, -h,
-h, h, -h,

new THREE.Vector3( h, h, -h ),
new THREE.Vector3( h, -h, -h ),
-h, h, -h,
h, h, -h,

new THREE.Vector3( h, -h, -h ),
new THREE.Vector3( -h, -h, -h ),
h, h, -h,
h, -h, -h,

h, -h, -h,
-h, -h, -h,

new THREE.Vector3( -h, -h, h ),
new THREE.Vector3( -h, h, h ),
-h, -h, h,
-h, h, h,

new THREE.Vector3( -h, h, h ),
new THREE.Vector3( h, h, h ),
-h, h, h,
h, h, h,

new THREE.Vector3( h, h, h ),
new THREE.Vector3( h, -h, h ),
h, h, h,
h, -h, h,

new THREE.Vector3( h, -h, h ),
new THREE.Vector3( -h, -h, h ),
h, -h, h,
-h, -h, h,

new THREE.Vector3( -h, -h, -h ),
new THREE.Vector3( -h, -h, h ),
-h, -h, -h,
-h, -h, h,

new THREE.Vector3( -h, h, -h ),
new THREE.Vector3( -h, h, h ),
-h, h, -h,
-h, h, h,

new THREE.Vector3( h, h, -h ),
new THREE.Vector3( h, h, h ),
h, h, -h,
h, h, h,

new THREE.Vector3( h, -h, -h ),
new THREE.Vector3( h, -h, h )
h, -h, -h,
h, -h, h
);

geometry.addAttribute( 'position', new THREE.Float32BufferAttribute( position, 3 ) );

return geometry;

}
Expand All @@ -180,14 +171,16 @@

var time = Date.now() * 0.001;

for ( var i = 0; i < objects.length; i ++ ) {
scene.traverse( function( object ) {

if ( object.isLine ) {

var object = objects[ i ];
object.rotation.x = 0.25 * time;
object.rotation.y = 0.25 * time;

object.rotation.x = 0.25 * time;
object.rotation.y = 0.25 * time;
}

}
} );

renderer.render( scene, camera );

Expand Down
15 changes: 12 additions & 3 deletions src/Three.Legacy.js
View file
Open in desktop
Expand Up @@ -832,11 +832,20 @@ Object.assign( Vector4.prototype, {

//

Geometry.prototype.computeTangents = function () {
Object.assign( Geometry.prototype, {

console.warn( 'THREE.Geometry: .computeTangents() has been removed.' );
computeTangents: function () {

};
console.error( 'THREE.Geometry: .computeTangents() has been removed.' );

},
computeLineDistances: function () {

console.error( 'THREE.Geometry: .computeLineDistances() has been removed. Use THREE.Line.computeLineDistances() instead.' );

}

} );

Object.assign( Object3D.prototype, {

Expand Down
19 changes: 0 additions & 19 deletions src/core/Geometry.js
View file
Open in desktop
Expand Up @@ -656,25 +656,6 @@ Geometry.prototype = Object.assign( Object.create( EventDispatcher.prototype ),

},

computeLineDistances: function () {

var d = 0;
var vertices = this.vertices;

for ( var i = 0, il = vertices.length; i < il; i ++ ) {

if ( i > 0 ) {

d += vertices[ i ].distanceTo( vertices[ i - 1 ] );

}

this.lineDistances[ i ] = d;

}

},

computeBoundingBox: function () {

if ( this.boundingBox === null ) {
Expand Down
58 changes: 58 additions & 0 deletions src/objects/Line.js
View file
Open in desktop
Expand Up @@ -35,6 +35,64 @@ Line.prototype = Object.assign( Object.create( Object3D.prototype ), {

isLine: true,

computeLineDistances: ( function () {

var start = new Vector3();
var end = new Vector3();

return function computeLineDistances() {

var geometry = this.geometry;

if ( geometry.isBufferGeometry ) {

// we assume non-indexed geometry
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Don't you think you should handle indexed geometry gracefully?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You're right. It should be better with 0286198


if ( geometry.index === null ) {

var positionAttribute = geometry.attributes.position;
var lineDistances = [ 0 ];

for ( var i = 1, l = positionAttribute.count; i < l; i ++ ) {

start.fromBufferAttribute( positionAttribute, i - 1 );
end.fromBufferAttribute( positionAttribute, i );

lineDistances[ i ] = lineDistances[ i - 1 ];
lineDistances[ i ] += start.distanceTo( end );

}

geometry.addAttribute( 'lineDistance', new THREE.Float32BufferAttribute( lineDistances, 1 ) );

} else {

console.warn( 'THREE.Line.computeLineDistances(): Computation only possible with non-indexed BufferGeometry.' );

}

} else if ( geometry.isGeometry ) {

var vertices = geometry.vertices;
var lineDistances = geometry.lineDistances;

lineDistances[ 0 ] = 0;

for ( var i = 1, l = vertices.length; i < l; i ++ ) {

lineDistances[ i ] = lineDistances[ i - 1 ];
lineDistances[ i ] += vertices[ i - 1 ].distanceTo( vertices[ i ] );

}

}

return this;

};

}() ),

raycast: ( function () {

var inverseMatrix = new Matrix4();
Expand Down