How to get distance btween Two points?

Questions
, , , , , ,
1

Please I calculate the coordinate between two points as shown in this picture using mathematic rules but when applied to the code not working

Capture
Capture1558×761 74 KB

hrere is the code that i use

var ls =200; // length segments
var ws = 4; // width segments, tracks
var controls = new THREE.OrbitControls( camera, renderer.domElement );
var lss = ls + 1;
var wss = ws + 1;

var faceCount = ls * ws * 2;
var vertexCount = lss * wss;

var g = new THREE.BufferGeometry( );

g.faceIndices = new Uint32Array( faceCount * 3 );
g.vertices = new Float32Array( vertexCount * 3 );  
//g.normals = new Float32Array( vertexCount * 3 ); 
//g.uvs = new Float32Array( vertexCount * 2 );

g.setIndex( new THREE.BufferAttribute( g.faceIndices, 1 ) );	
g.addAttribute( 'position', new THREE.BufferAttribute( g.vertices, 3 ).setDynamic(true ) );
//g.addAttribute( 'normal', new THREE.BufferAttribute( g.normals, 3 ).setDynamic( true ) );
//g.addAttribute( 'uv', new THREE.BufferAttribute( g.uvs, 2 ) );

var idxCount = 0;

for ( var j = 0; j < ls; j ++ ) {
   	
   for ( var i = 0; i < ws; i ++ ) {
   	
   	// 2 faces / segment,  3 vertex indices
   	a =  wss * j+i;
   	b1 = wss * ( j + 1 ) + i;		// right-bottom
   	c1 = wss * ( j + 1 ) + 1 + i;
   	b2 = wss * ( j + 1 ) + 1 + i;	// left-top
   	c2 = wss * j + 1 + i;
   	
   	g.faceIndices[ idxCount     ] = a; // right-bottom
   	g.faceIndices[ idxCount + 1 ] = b1;
   	g.faceIndices[ idxCount + 2 ] = c1; 
   	
   	g.faceIndices[ idxCount + 3 ] = a; // left-top
   	g.faceIndices[ idxCount + 4 ] = b2,
   	g.faceIndices[ idxCount + 5 ] = c2; 
   	
   	g.addGroup( idxCount, 6, i ); // write groups for multi material
   	
   	idxCount += 6;
   			
   }
   	
}
var curve = new THREE.CatmullRomCurve3( [
   new THREE.Vector3( -25, 0, 20 ),
   new THREE.Vector3( 20, 0, 40 ),
   new THREE.Vector3( -20, 0, -20 ),
   new THREE.Vector3( 25, 0, -40 ),
   
] );
var points = curve.getPoints( ls );
var curveGeometry = new THREE.BufferGeometry().setFromPoints( points );
var x, y, z;
var vIdx = 0; // vertex index
var posIdx; // position  index
var w=1;
for ( var j = 0; j < lss; j ++ ) {  // length
   	
   for ( var i = 0; i < wss; i ++ ) { // width
   	
   	
   
   	x = points[ j ].x + w*(points[i+1].z-points[i].z)/points[j].distanceTo(points[j+1]); 
   	y = points[ j ].y;
   	z = points[ j ].z -w*(points[i+1].x-points[i].x)/points[j].distanceTo(points[j+1]); ;
   	
   	xyzSet();
   	
   	vIdx ++;
   	
   }
   
}

g.attributes.position.needsUpdate = true;
//g.attributes.normal.needsUpdate = true;
var material=new THREE.MeshBasicMaterial( { color: 'gray', side: THREE.DoubleSide, wireframe:true } )

var mesh = new THREE.Mesh( g, material );
scene.add( mesh );
var curveMaterial = new THREE.LineBasicMaterial( { color : 'yellow' } );
var curveLine = new THREE.Line( curveGeometry, curveMaterial );
curveLine.computeLineDistances();
scene.add( curveLine );



// set vertex position
function xyzSet() {
   
   posIdx = vIdx * 3;
   
   g.vertices[ posIdx ]  = x;
   g.vertices[ posIdx + 3 ]  = y;
   g.vertices[ posIdx + 2 ]  = z;

}
2

Please simplify your code, so it shows only the part that is not working, it will be easier to tell what is wrong.

As a very random guess, this pattern might cause the issue:

g.vertices[ posIdx ]  = x;
g.vertices[ posIdx + 3 ]  = y;
g.vertices[ posIdx + 2 ]  = z;

xyz offsets are normally sequential, so they should be 1,2,3 or 0,1,2, in you case it’s 0,2,3.