Plane intersects mesh with three.js r125

Hi,

I’m trying to adapt this example PointsGroupingCutPlane to .r125.

So far, when I’m doing such a thing, I use this link as a ref Updating THREE.Geometry to THREE.BufferGeometry - Three.js Tutorials, but for a line like:

this.plane.localToWorld(planePointB.copy(this.plane.geometry.vertices[this.plane.geometry.faces[0].b]));

this is not enough.
Basically, what is the r125 equivalent of face? Will copy work? Is there any better tutorial link than the one I have?
Or even better, did anyone adapt this case?

BufferGeometry can be non-indexed or indexed.
Non-indexed: a triplet of consequent vertices defines a face.
Indexed: a triplet of consequent indices of vertices defines a face.

1 Like

When I started with three.js, I implemented my first addon ( Addon. Produces almost infinite many time-varying geometries with functions) with the old geometry. After being told that this geometry will not last forever, I ported to both indexed and non-indexed BufferGeometry.

Maybe the direct comparison of the variants helps, although I didn’t use the requested line. It is very nested. You may have to break it down into its parts in the old variant first.

Code at https://github.com/hofk/THREEf.js/blob/cc28a353fe8e3a6e98956dc299d1762b178ad452/THREEf_90/THREEf.js

This is the grouping of variants, folded in my editor. The line numbers match.

2022-02-05 20.32.42

2022-02-05 20.34.59

2 Likes

Hi, thank you for sharing the link.

I had seen your addon before, but never had the time to dig in.
I guess this time I have no choice but to spend some hours trying to figure out how one switches from an old solution to a a post r125 one.

For those facing the issue, I will post the r125 translation if I can make it.

It may be enough for you to look at these two examples. This is much less time-consuming.

2022 discourse.threejs.hofk.de

2022-02-06 14.46.12

Hi again, for those who are interested, here is my solution when I draw the intersection points of this.dodeca and this.plane. Code to be optimized, but right now it works:

drawIntersectionPoints() {

        var pointsOfIntersection = new THREE.BufferGeometry();

        var a = new THREE.Vector3(),
            b = new THREE.Vector3(),
            c = new THREE.Vector3();
        var planePointA = new THREE.Vector3(),
            planePointB = new THREE.Vector3(),
            planePointC = new THREE.Vector3();
        var lineAB = new THREE.Line3(),
            lineBC = new THREE.Line3(),
            lineCA = new THREE.Line3();

        var pointOfIntersection = new THREE.Vector3();

        var mathPlane = new THREE.Plane();

        const positionAttribute = this.plane.geometry.getAttribute('position');

        const localVertex = new THREE.Vector3();

        localVertex.fromBufferAttribute(positionAttribute, 0);
        this.plane.localToWorld(planePointA.copy(localVertex));
        localVertex.fromBufferAttribute(positionAttribute, 1);
        this.plane.localToWorld(planePointB.copy(localVertex));
        localVertex.fromBufferAttribute(positionAttribute, 2);
        this.plane.localToWorld(planePointC.copy(localVertex));

        mathPlane.setFromCoplanarPoints(planePointA, planePointB, planePointC);

        var positions = [];

        const dodecaPositionAttribute = this.dodeca.geometry.getAttribute('position');
        console.log(dodecaPositionAttribute);
        for (let vertexIndex = 0; vertexIndex < dodecaPositionAttribute.count; vertexIndex += 3) {

            localVertex.fromBufferAttribute(dodecaPositionAttribute, vertexIndex);
            this.dodeca.localToWorld(a.copy(localVertex));
            localVertex.fromBufferAttribute(dodecaPositionAttribute, vertexIndex + 1);
            this.dodeca.localToWorld(b.copy(localVertex));
            localVertex.fromBufferAttribute(dodecaPositionAttribute, vertexIndex) + 2;
            this.dodeca.localToWorld(c.copy(localVertex));

            lineAB = new THREE.Line3(a, b);
            lineBC = new THREE.Line3(b, c);
            lineCA = new THREE.Line3(c, a);

            this.setPointOfIntersection(lineAB, mathPlane, positions, pointOfIntersection);
            this.setPointOfIntersection(lineBC, mathPlane, positions, pointOfIntersection);
            this.setPointOfIntersection(lineCA, mathPlane, positions, pointOfIntersection);
        }

        pointsOfIntersection.setAttribute(
            'position',
            new THREE.BufferAttribute(new Float32Array(positions), 3));

        var pointsMaterial = new THREE.PointsMaterial({
            size: 10,
            color: 0xffff00
        });

        var points = new THREE.Points(pointsOfIntersection, pointsMaterial);
        this.scene.add(points);
    }

    setPointOfIntersection(line, plane, positions, pointOfIntersection) {
        pointOfIntersection = plane.intersectLine(line);
        if (pointOfIntersection) {
            var g = pointOfIntersection.clone();
            positions.push(g.x);
            positions.push(g.y);
            positions.push(g.z);
        };
    }````
2 Likes