Create a curved plane surface which dynamically changes its size

[hofk]

Constructively, this can be designed to match the sketch Create a curved plane surface which dynamically changes its size (page 8, left column only) like this

Only one triangle is necessary in addition to the triangles of the three streets.
The angle can be used for simple calculation of the coordinates of the vertices in the area of the branch.

[ILove_hofk]

Hi @hofk,

Thanks for your suggestion and I will have a try.

In addition, I’d like to ask another question that you mentioned above, page 16.

Since only the components x and z of the normal are used, but the y component is not always 0, it resulted in different road widths.

I followed your code but it didn’t work. I still got the different road widths if observing them carefully.

    for ( var j = 0; j < lss; j ++ ) { // length
        for ( var i = 0; i < wss; i ++ ) { // width

            // calculate here the coordinates according to your wishes

            tangent = curve.getTangent( j / ls ); //  .. / length segments
            normal.crossVectors( tangent, binormal ); 
            binormal.crossVectors( normal, tangent ); // new binormal

            normal.y = 0;

            normal.normalize();

            var lxz = Math.sqrt(normal.x*normal.x + normal.z*normal.z);
            var nx = normal.x / lxz;
            var nz = normal.z / lxz;

            //x = points[ j ].x + d[ i ] * normal.x;
            x = points[ j ].x + d[ i ] * nx;
            y = points[ j ].y;
            //z = points[ j ].z + d[ i ] * normal.z;
            z = points[ j ].z + d[ i ] * nz;

            xyzSet();
            vIdx ++;
        }
    }

My result is:

[hofk]

I have a hunch. Please use a wireframe material so we can see the construction.

[ILove_hofk]

Hi @hofk

How about this?

[hofk]

My suspicions were confirmed.

If you draw a circle with three.js and choose a small number for the segments, you get a triangle, square, …hexagon etc.

If you use too few length segments for the road, the road is no longer consistent.

My example with 35 and 500

This test reveals yet another problem.

If you make the width of the side strips too large in relation to the strongest curvature, this will not work.

But these “faults” lie in the nature of the road construction.

In case of natural serpentines in the mountains, this section is also specially designed.

I hope I could help.

[ILove_hofk]

Hi @hofk,

Yeah, I got it and thank you for your patience and explanation. Love you

[Frundik]

Hello! First of all, I want to express my respect to the author for his work.
And I want to ask: is it possible to build a road not as a plane, but as a 3D object.
For example, like this (see schematic picture):
And if possible, how to build and apply textures to a 3D road?

Thanks

[hofk]

See above:

---

---

Vertical and horizontal parts can be combined.

I think your street is a very special version of that: Wall

[Frundik]

Thanks for the answer.

I mean is it possible to create a more complex road than walls?

Like this or that?

Can I set the geometry like in the picture and “extrude” along the path?

Sorry if I’m asking stupid questions

Thanks

[hofk]

In principle, you can create any shape and run it along a curve. Sometimes it is easier not to create a general solution for all possible cases, but to make a very special construction.

Have a look at these examples from the Collection of examples from discourse.threejs.org.

CirclesOnCurve
SineWaveGrooveRing
SpiralFromCylinder

Also dynamic.
Curved2Geometry

[weijian-zhu]

@hofk
I tried using THREEg.createRoad to generate the pavement, but the resulting pavement doesn’t rotate, once I set the rotation, the pavement disappears

[hofk]

Without a live example, I can’t see why it doesn’t work the way you think it does.

[weijian-zhu]

hi,This is my example

When I open line 123, the road disappears

// mesh.rotation.x = 1.57

[PavelBoytchev]

Rotation is done in respect to (0,0,0). The line is far away from (0,0,0). When it is rotated, it goes outside the window. Here is an illustration:

[weijian-zhu]

thanks you，It dawned on me