threejs如何创建一个半圆环柱体？

方法1，可完美贴图

处理交集、补集的方法。threeBSP已经很多年不维护了。OctreeCSG需要用到两个文件：OctreeCSG.js和three-triangle-intersection.js

import * as THREE from 'three';
import { OrbitControls } from 'three/addons/controls/OrbitControls.js'
import { ThreeNormal } from 'threejs-run';
import OctreeCSG from './threejs/OctreeCSG';
import pic_01 from '@/assets/images/index/01.png';

  const geometry1 = new THREE.CylinderGeometry( R1, R1, shan_height, 32, 1, false, startAngle, shanR );
  const geometry2 = new THREE.CylinderGeometry( R2, R2, shan_height, 32, 1, false, startAngle, shanR );
  const mesh1 = new THREE.Mesh(geometry1, new THREE.MeshBasicMaterial()); //网格模型对象Mesh
  const mesh2 = new THREE.Mesh(geometry2, new THREE.MeshBasicMaterial()); //网格模型对象Mesh

  const resultMesh = OctreeCSG.meshSubtract(mesh2, mesh1);
  const doorColorTexture = new THREE.TextureLoader().load(this.getImage(index));
  const materials = [
    new THREE.MeshBasicMaterial({
      map: doorColorTexture,
      // opacity: 0.9,
      transparent: true, //使用背景透明的png贴图，注意开启透明计算
    }),
  ];
  resultMesh.material = materials;
  this.meshList_wp.push(resultMesh);
  scene.add(resultMesh);

方法2，贴图根据分段走，不是我想要的，但是半圆环柱体能够实现

import * as THREE from 'three';
import Threejs from './threejs';
import { OrbitControls } from 'three/addons/controls/OrbitControls.js'
import pic_01 from '@/assets/images/index/01.png';

addHalfRing(scene, R1, R2, shan_height, y, startAngle, endAngle) {
  // 绘制半圆环柱体
  const heartShape = new THREE.Shape();
  //外层弧形
  // x, y -- 弧线的绝对中心。
  // radius -- 弧线的半径。
  // startAngle -- 起始角，以弧度来表示。
  // endAngle -- 终止角，以弧度来表示。
  // clockwise -- 以顺时针方向创建（扫过）弧线。默认值为false。
  heartShape.absarc(0, 0, R1, startAngle, endAngle)
  heartShape.absarc(0, 0, R2, endAngle, startAngle, true)

  const extrudeSettings = {
    curveSegments: 12, // 曲线上点的数量，默认值是12。
    depth: shan_height, // 挤出的形状的深度，默认值为1。
    bevelEnabled: true, // 对挤出的形状应用是否斜角，默认值为true。
    bevelSegments: 0, // 斜角的分段层数，默认值为3。
    steps: 1, // 用于沿着挤出样条的深度细分的点的数量，默认值为1。
    bevelSize: 1, // 斜角与原始形状轮廓之间的延伸距离，默认值为bevelThickness-0.1。
    bevelThickness: 0.2, // 设置原始形状上斜角的厚度。默认值为0.2。
  };
  //使用 ExtrudeGeometry 把扇形平面拉伸成立体状
  const geometry = new THREE.ExtrudeGeometry( heartShape, extrudeSettings );

  const doorColorTexture = new THREE.TextureLoader().load(pic_01);
  const materials = [
    new THREE.MeshBasicMaterial({
      color: 0xa49114,
      transparent: true, //使用背景透明的png贴图，注意开启透明计算
    }),
    new THREE.MeshBasicMaterial({
      map: doorColorTexture,
      // opacity: 0.9,
      transparent: true, //使用背景透明的png贴图，注意开启透明计算
    }),
    // new THREE.MeshBasicMaterial({
    //   color: 0x141ea4,
    //   transparent: true, //使用背景透明的png贴图，注意开启透明计算
    // }),
  ];

  const mesh = new THREE.Mesh( geometry, materials );
  mesh.rotateX(Math.PI / 2); // 沿着X轴旋转
  // mesh.rotateY(Math.PI); // 沿着X轴旋转
  mesh.position.set(0, y, 0);
  scene.add(mesh);
},