3d shapeProfile along contour

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>
<script>
  function ProfiledContourGeometry(profileShape, contour, contourClosed, openEnded) {
    
  	contourClosed = contourClosed !== undefined ? contourClosed : true;
    openEnded = openEnded !== undefined ? openEnded : false;
    openEnded = contourClosed === true ? false : openEnded;
		
    let profileGeometry = new THREE.ShapeBufferGeometry(profileShape);
    let flipProfileGeometry = flipShapeGeometry(profileGeometry);
    profileGeometry.rotateX(Math.PI * 0.5);
    let profile = profileGeometry.attributes.position;
		
    let addEnds = openEnded === false ? 2 : 0;
    let profilePoints = new Float32Array(profile.count * (contour.length + addEnds) * 3);
		
    let endProfiles = [];
    
    for (let i = 0; i < contour.length; i++) {
      let v1 = new THREE.Vector2().subVectors(contour[i - 1 < 0 ? contour.length - 1 : i - 1], contour[i]);
      let v2 = new THREE.Vector2().subVectors(contour[i + 1 == contour.length ? 0 : i + 1], contour[i]);
      let angle = v2.angle() - v1.angle();
      let halfAngle = angle * 0.5;
			
      let hA = halfAngle;
      let tA = v2.angle() + Math.PI * 0.5;
      if (!contourClosed){
      	if (i == 0 || i == contour.length - 1) {hA = Math.PI * 0.5;}
        if (i == contour.length - 1) {tA = v1.angle() - Math.PI * 0.5;}
      }
      
      let shift = Math.tan(hA - Math.PI * 0.5);
      let shiftMatrix = new THREE.Matrix4().set(
             1, 0, 0, 0, 
        -shift, 1, 0, 0,
             0, 0, 1, 0,
             0, 0, 0, 1
      );
			
      
      let tempAngle = tA;
      let rotationMatrix = new THREE.Matrix4().set(
        Math.cos(tempAngle), -Math.sin(tempAngle), 0, 0,
        Math.sin(tempAngle),  Math.cos(tempAngle), 0, 0,
                          0,                    0, 1, 0,
                          0,              ...

CSS

body {
  overflow: hidden;
  margin: 0;
}

JavaScript

var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 1, 1000);
camera.position.set(5, 5, 10);
var renderer = new THREE.WebGLRenderer({
  antialias: true
});
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

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

var light = new THREE.DirectionalLight(0xffffff, 0.75);
light.position.setScalar(10);
scene.add(light);
scene.add(new THREE.AmbientLight(0xffffff, 0.25));

var helper = new THREE.GridHelper(20, 20);
//helper.geometry.rotateX(Math.PI * -.5);
scene.add(helper);

var profileShape1 = new THREE.Shape();
profileShape1.moveTo(0, 0);
profileShape1.lineTo(0, 1);
profileShape1.absarc(1, 1, 0.5, Math.PI, Math.PI * 1.5);
profileShape1.lineTo(1, 0);

var contour1 = [
  new THREE.Vector2(0, 0),
  new THREE.Vector2(1, 1),
  new THREE.Vector2(2, 1),
  new THREE.Vector2(2, 0),
  new THREE.Vector2(1, -1)
];

var geometry1 = ProfiledContourGeometry(profileShape1, contour1, false, true);
geometry1.rotateX(-Math.PI * 0.5);
var fullProfile1 = new THREE.Mesh(geometry1, new THREE.MeshLambertMaterial({
  color: "red",
  wireframe: false
}));
scene.add(fullProfile1);

var geometry12 = ProfiledContourGeometry(profileShape1, contour1, false, false);
geometry12.rotateX(-Math.PI * 0.5);
var fullProfile12 = new THREE.Mesh(geometry12, new THREE.MeshLambertMaterial({
  color: "pink",
  wireframe: false
}));
fullProfile12.position.set(0, 0, 4);
scene.add(fullProfile12);

var profileShape2 = new THREE.Shape();
profileShape2.absarc(0, 0, 1, 0, Math.PI * 2);

var contour2 = [
	new THREE.Vector2(-4, 0),
  new THREE.Vector2(0, 5),
  new THREE.Vector2(5, 5),
  new THREE.Vector2(5, 0)
]

var geometry2 = ProfiledContourGeometry(profileShape2, contour2, false, true);
var fullProfile2 = new THREE.Mesh(geometry2, new THREE.MeshBasicMaterial({
  color: "aqua",
  wireframe: true
}));
fullProfile2.position.set(-7, 1,...