curves

by black strings

HTML

<script src="https://cdn.jsdelivr.net/npm/[email protected]/build/three.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/examples/js/controls/OrbitControls.js"></script>

JavaScript

var scene, renderer, camera;
var cube;
var controls;

init();
lightSetup();
animate();

function init() {
  renderer = new THREE.WebGLRenderer({
    antialias: true
  });
  renderer.localClippingEnabled = true;
  var width = window.innerWidth;
  var height = window.innerHeight;
  renderer.setSize(width, height);
  document.body.appendChild(renderer.domElement);

  scene = new THREE.Scene();

  var center = new THREE.Vector3(72, 0.625, -72);

  var gridXZ = new THREE.GridHelper(1000, 100);
  scene.add(gridXZ);

  var axes = new THREE.AxesHelper(1000);
  scene.add(axes);
  
  
  /* 
  const v1 = new THREE.Vector3(45.48, 27.18, 0);
  const v2 = new THREE.Vector3(75.18, -2.516, 0);
  const v3 = new THREE.Vector3(-33, 117, 0);
  const v4 = new THREE.Vector3(-33,75, 0);
  const v5 = new THREE.Vector3(45.48, 27.18, 0);
  const v6 = new THREE.Vector3(75.18, -2.516, 0);
  const v7 = new THREE.Vector3(50.07, -64.38, 0);
  const v8 = new THREE.Vector3(79.77, -34.68, 0);
  
  const newPoints = [v1, v2, v3, v4, v5, v6, v7, v8];
   */
  const v1 = new THREE.Vector3(1, 0, 0);
  const v2 = new THREE.Vector3(3, 0, 0);
  const v3 = new THREE.Vector3(1, 0, 0);
  const v4 = new THREE.Vector3(5, 0, 0);
  const newPoints = [v1, v4, v3, v2];
  
  newPoints.sort((a, b) => a.x - b.x).sort((a,b) => a.y - b.y).sort((a,b) => a.z - b.z);
  console.log('sorted', newPoints);
  
  const finalPoints = removeDuplicates(newPoints);
  console.log('final', finalPoints);
 /*  
  const arr = [1,2,5,3,5,4];
  const arr2 = arr.sort( (a,b) => {
    if(a < b){
      return -1;
    } else {
      return 1;
    }
    return 0;
  });
  console.log('sort num', arr2);
   */
  camera = new THREE.PerspectiveCamera(45, width / height, 1, 10000);
  camera.position.x = 76;
  camera.position.y = 76;
  camera.position.z = 76;
  camera.lookAt(center);
  camera.updateProjectionMatrix();

  controls = new THREE.OrbitControls(camera, renderer.domElement);

  var path = new THREE.Path();

  var points = [new...