yuliang
/
yvan-rcs-web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

CLX CL2 结构整理

master
yuliang 6 months ago
parent
449910f24a
commit
d7290975b9
4 changed files with 751 additions and 714 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 300
      src/modules/cl2/Cl23dObject.ts
  2. 282
      src/modules/cl2/Cl2Renderer.ts
  3. 447
      src/modules/clx/Clx3dObject.ts
  4. 436
      src/modules/clx/ClxRenderer.ts

300
src/modules/cl2/Cl23dObject.ts
View File

@ -0,0 +1,300 @@
import * as THREE from "three";
import {CSG} from "three-csg-ts";
//@ts-ignore
import {mergeGeometries} from 'three/addons/utils/BufferGeometryUtils.js'
export default class Cl23dObject extends THREE.Object3D {
// 创建ptr的底座
private static createPtrPedestal(): THREE.BufferGeometry {
// 参数配置
const radius = 0.8; // 圆半径
const lineDist = 0.75; // 切割线距离圆心距离
const segments = 64; // 圆的分段精度
// 计算切割线与圆的交点
const intersectY = Math.sqrt(radius*radius - lineDist*lineDist);
const startAngle = Math.asin(intersectY/radius);
const endAngle = Math.acos(intersectY/radius);
const shape = new THREE.Shape();
shape.moveTo(0, 0); // 起点在圆心
shape.absarc(0, 0, 0.8, startAngle, endAngle, false); // 从0到π绘制半圆
shape.absarc(0, 0, 0.8, startAngle + Math.PI/2, endAngle + Math.PI/2, false);
shape.absarc(0, 0, 0.8, startAngle + Math.PI, endAngle + Math.PI, false);
shape.absarc(0, 0, 0.8, startAngle + Math.PI/2 * 3, endAngle + Math.PI/2 * 3, false);
shape.lineTo(-0.5, -intersectY)
shape.lineTo(-0.5, -intersectY + 0.17)
shape.lineTo(0.75, -intersectY + 0.17)
shape.lineTo(0.75, intersectY - 0.17)
shape.lineTo(-0.5, intersectY - 0.17)
shape.lineTo(-0.5, intersectY)
shape.closePath(); // 闭合路径
// 拉伸轨迹线
const curve = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.02, 0), new THREE.Vector3(0, 0.22, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const options = {
steps: 1,
bevelEnabled: false,
extrudePath: curve // 设置挤出轨迹
}
// 创建挤出几何体
const geometry = new THREE.ExtrudeGeometry(shape, options)
const material = new THREE.MeshBasicMaterial({color: 0xffdddbca});
const mesh = new THREE.Mesh(geometry, material);
mesh.updateMatrix()
// 倒角
const shapeD = new THREE.Shape();
shapeD.moveTo(-0.02, -0.02);
shapeD.lineTo(0.02, 0.02)
shapeD.lineTo(-0.02, 0.02)
shapeD.closePath()
const curveD = new THREE.EllipseCurve(
0, 0, radius, radius, 0, Math.PI * 2, false, 0
);
// 生成拉伸路径点
const pointsD = curveD.getPoints(segments).map(p =>
new THREE.Vector3(p.x, 0.20, p.y)
);
// 3. 挤出成型
const optionsD = {
steps: segments,
bevelEnabled: false,
// bevelSegments: 0.01,
extrudePath: new THREE.CatmullRomCurve3(pointsD)
};
const geometryD = new THREE.ExtrudeGeometry(shapeD, optionsD)
const meshD = new THREE.Mesh(geometryD, material);
meshD.updateMatrix()
// 布尔运算
const result = CSG.subtract(mesh, meshD)
return result.geometry
}
// 创建ptr的立柱
private static createPtrPillar(): THREE.BufferGeometry {
// 606.5
const width = 0.245
const depth = 0.716
const dd = 0.05
const shape = new THREE.Shape();
shape.moveTo(-0.728, -0.358 + dd);
shape.lineTo(-0.728 + dd, -0.358);
shape.lineTo(-0.728 + width - dd, -0.358);
shape.lineTo(-0.728 + width, -0.358 + dd);
shape.lineTo(-0.728 + width, -0.28);
shape.lineTo(-0.728 + width - 0.08, -0.28);
shape.lineTo(-0.728 + width - 0.08, 0.28);
shape.lineTo(-0.728 + width, 0.28);
shape.lineTo(-0.728 + width, -0.358 + depth - dd);
shape.lineTo(-0.728 + width - dd, -0.358 + depth);
shape.lineTo(-0.728 + dd, -0.358 + depth);
shape.lineTo(-0.728, -0.358 + depth - dd);
// shape.lineTo(-0.728, -0.358 + dd);
// shape.closePath()
// 拉伸轨迹线
const curve = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.22, 0), new THREE.Vector3(0, 1.872, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const options = {
steps: 1,
bevelSegments: 0.05,
bevelEnabled: true,
extrudePath: curve // 设置挤出轨迹
}
// 创建挤出几何体
const geometry = new THREE.ExtrudeGeometry(shape, options)
// const material = new THREE.MeshBasicMaterial({color: 0xffdddbca});
// const mesh = new THREE.Mesh(geometry, material);
const fd = 0.03
const shapeBf = new THREE.Shape();
shapeBf.moveTo(-0.728 + width - 0.08, -0.28);
shapeBf.lineTo(-0.728 + width + 0.02, -0.28);
shapeBf.lineTo(-0.728 + width + 0.02, -0.25);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130 - fd, -0.25);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130, -0.25 + fd);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130, -0.14 - fd);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130 - fd, -0.14);
shapeBf.lineTo(-0.728 + width + 0.02, -0.14);
shapeBf.lineTo(-0.728 + width + 0.02, 0.14);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130 - fd, 0.14);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130, 0.14 + fd);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130, 0.25 - fd);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130 - fd, 0.25);
shapeBf.lineTo(-0.728 + width + 0.02, 0.25);
shapeBf.lineTo(-0.728 + width + 0.02, 0.28);
shapeBf.lineTo(-0.728 + width - 0.08, 0.28);
shapeBf.closePath()
// 拉伸轨迹线
const curveBf = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.02, 0), new THREE.Vector3(0, 0.06, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const optionsBf = {
steps: 1,
bevelSegments: 0.05,
bevelEnabled: true,
extrudePath: curveBf // 设置挤出轨迹
}
// 创建挤出几何体
const geometryBf = new THREE.ExtrudeGeometry(shapeBf, optionsBf)
return mergeGeometries([geometry, geometryBf])
}
// 创建ptr的立柱
private static createPtrFork(): THREE.BufferGeometry {
// 606.5
const width = 0.245
const depth = 0.716
const dd = 0.05
const fd = 0.03
const shape = new THREE.Shape();
shape.moveTo(-0.728 + width - 0.08, -0.28);
shape.lineTo(-0.728 + width + 0.02, -0.28);
shape.lineTo(-0.728 + width + 0.02, -0.27);
shape.lineTo(-0.728 + width + 0.02 + 1.130 - fd, -0.27);
shape.lineTo(-0.728 + width + 0.02 + 1.130, -0.27 + fd);
shape.lineTo(-0.728 + width + 0.02 + 1.130, -0.12 - fd);
shape.lineTo(-0.728 + width + 0.02 + 1.130 - fd, -0.12);
shape.lineTo(-0.728 + width + 0.02, -0.12);
shape.lineTo(-0.728 + width + 0.02, 0.12);
shape.lineTo(-0.728 + width + 0.02 + 1.130 - fd, 0.12);
shape.lineTo(-0.728 + width + 0.02 + 1.130, 0.12 + fd);
shape.lineTo(-0.728 + width + 0.02 + 1.130, 0.27 - fd);
shape.lineTo(-0.728 + width + 0.02 + 1.130 - fd, 0.27);
shape.lineTo(-0.728 + width + 0.02, 0.27);
shape.lineTo(-0.728 + width + 0.02, 0.28);
shape.lineTo(-0.728 + width - 0.08, 0.28);
shape.closePath()
// 拉伸轨迹线
const curve = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.02, 0), new THREE.Vector3(0, 0.482, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const options = {
steps: 1,
bevelSegments: 0.05,
bevelEnabled: true,
extrudePath: curve // 设置挤出轨迹
}
// 创建挤出几何体
const geometry = new THREE.ExtrudeGeometry(shape, options)
const material = new THREE.MeshBasicMaterial({color: 0xffdddbca});
const mesh = new THREE.Mesh(geometry, material);
mesh.updateMatrix()
const shapeD = new THREE.Shape();
shapeD.moveTo(-0.728 + width + 0.02, -0.3);
shapeD.lineTo(-0.728 + width + 0.02 + 1.2, -0.3);
shapeD.lineTo(-0.728 + width + 0.02 + 1.2, 0.3);
shapeD.lineTo(-0.728 + width + 0.02, 0.3);
shape.closePath()
// 拉伸轨迹线
const curveD = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.07, 0), new THREE.Vector3(0, 0.482, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const optionsD = {
steps: 1,
bevelSegments: 0.05,
bevelEnabled: true,
extrudePath: curveD // 设置挤出轨迹
}
// 创建挤出几何体
const geometryD = new THREE.ExtrudeGeometry(shapeD, optionsD)
const meshD = new THREE.Mesh(geometryD, material);
meshD.updateMatrix()
// 布尔运算
const result = CSG.subtract(mesh, meshD)
return result.geometry
}
private static ptrPedestalGeometry: THREE.BufferGeometry = null;
private static ptrPillarGeometry: THREE.BufferGeometry = null;
private static ptrForkGeometry: THREE.BufferGeometry = null;
constructor(item: ItemJson, option?: RendererCudOption) {
super();
if (!Cl23dObject.ptrPedestalGeometry) {
Cl23dObject.ptrPedestalGeometry = Cl23dObject.createPtrPedestal()
}
const ptrPedestalGeometry = Cl23dObject.ptrPedestalGeometry
const ptrPedestalMaterial = new THREE.MeshPhongMaterial({color: 0xffdddbca});
const ptrPedestalMesh = new THREE.Mesh(ptrPedestalGeometry, ptrPedestalMaterial);
ptrPedestalMesh.name = 'ptrPedestalMesh'
if (!Cl23dObject.ptrPillarGeometry) {
Cl23dObject.ptrPillarGeometry = Cl23dObject.createPtrPillar()
}
const ptrPillarGeometry = Cl23dObject.ptrPillarGeometry;
const ptrPillarMaterial = new THREE.MeshPhongMaterial({color: 0xff6c6956});
const ptrPillarMesh = new THREE.Mesh(ptrPillarGeometry, ptrPillarMaterial);
ptrPillarMesh.name = 'ptrPillarMesh'
if (!Cl23dObject.ptrForkGeometry) {
Cl23dObject.ptrForkGeometry = Cl23dObject.createPtrFork()
}
const ptrForkGeometry = Cl23dObject.ptrForkGeometry;
const ptrForkMaterial = new THREE.MeshPhongMaterial({color: 0xff444444});
const ptrForkMesh = new THREE.Mesh(ptrForkGeometry, ptrForkMaterial);
ptrForkMesh.name = 'ptrForkMesh'
this.add(ptrPedestalMesh)
const groupPillar = new THREE.Group()
groupPillar.add(ptrPillarMesh)
groupPillar.add(ptrForkMesh)
this.add(groupPillar)
}
}

282
src/modules/cl2/Cl2Renderer.ts
View File

@ -1,9 +1,7 @@
import * as THREE from 'three' import * as THREE from 'three'
import BaseRenderer from '@/core/base/BaseRenderer.ts' import BaseRenderer from '@/core/base/BaseRenderer.ts'
import Constract from '@/core/Constract.ts' import Constract from '@/core/Constract.ts'
import { CSG } from 'three-csg-ts' import Cl23dObject from "@/modules/cl2/Cl23dObject";
//@ts-ignore
import { mergeGeometries } from 'three/addons/utils/BufferGeometryUtils.js'
/** /**
* ptr侧叉渲染器 * ptr侧叉渲染器
@ -58,30 +56,9 @@ export default class PtrRenderer extends BaseRenderer {
return null return null
} }
const group = new THREE.Group() const group = new Cl23dObject(item, option)
group.name = PtrRenderer.POINT_NAME group.name = PtrRenderer.POINT_NAME
const ptrPedestalGeometry = this.createPtrPedestal(item, option)
const ptrPedestalMaterial = new THREE.MeshPhongMaterial({color: 0xffdddbca});
const ptrPedestalMesh = new THREE.Mesh(ptrPedestalGeometry, ptrPedestalMaterial);
ptrPedestalMesh.name = 'ptrPedestalMesh'
const ptrPillarGeometry = this.createPtrPillar(item, option);
const ptrPillarMaterial = new THREE.MeshPhongMaterial({color: 0xff6c6956});
const ptrPillarMesh = new THREE.Mesh(ptrPillarGeometry, ptrPillarMaterial);
ptrPillarMesh.name = 'ptrPillarMesh'
const ptrForkGeometry = this.createPtrFork(item, option);
const ptrForkMaterial = new THREE.MeshPhongMaterial({color: 0xff444444});
const ptrForkMesh = new THREE.Mesh(ptrForkGeometry, ptrForkMaterial);
ptrForkMesh.name = 'ptrForkMesh'
group.add(ptrPedestalMesh)
const groupPillar = new THREE.Group()
groupPillar.add(ptrPillarMesh)
groupPillar.add(ptrForkMesh)
group.add(groupPillar)
// 设置位置 // 设置位置
group.position.set(item.tf[0][0], item.tf[0][1], item.tf[0][2]) group.position.set(item.tf[0][0], item.tf[0][1], item.tf[0][2])
return group return group
@ -98,259 +75,4 @@ export default class PtrRenderer extends BaseRenderer {
throw new Error('Ptr createPointBasic not allow!') throw new Error('Ptr createPointBasic not allow!')
} }
// 创建ptr的底座
createPtrPedestal(item: ItemJson, option?: RendererCudOption): THREE.BufferGeometry {
// 参数配置
const radius = 0.8; // 圆半径
const lineDist = 0.75; // 切割线距离圆心距离
const segments = 64; // 圆的分段精度
// 计算切割线与圆的交点
const intersectY = Math.sqrt(radius*radius - lineDist*lineDist);
const startAngle = Math.asin(intersectY/radius);
const endAngle = Math.acos(intersectY/radius);
const shape = new THREE.Shape();
shape.moveTo(0, 0); // 起点在圆心
shape.absarc(0, 0, 0.8, startAngle, endAngle, false); // 从0到π绘制半圆
shape.absarc(0, 0, 0.8, startAngle + Math.PI/2, endAngle + Math.PI/2, false);
shape.absarc(0, 0, 0.8, startAngle + Math.PI, endAngle + Math.PI, false);
shape.absarc(0, 0, 0.8, startAngle + Math.PI/2 * 3, endAngle + Math.PI/2 * 3, false);
shape.lineTo(-0.5, -intersectY)
shape.lineTo(-0.5, -intersectY + 0.17)
shape.lineTo(0.75, -intersectY + 0.17)
shape.lineTo(0.75, intersectY - 0.17)
shape.lineTo(-0.5, intersectY - 0.17)
shape.lineTo(-0.5, intersectY)
shape.closePath(); // 闭合路径
// 拉伸轨迹线
const curve = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.02, 0), new THREE.Vector3(0, 0.22, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const options = {
steps: 1,
bevelEnabled: false,
extrudePath: curve // 设置挤出轨迹
}
// 创建挤出几何体
const geometry = new THREE.ExtrudeGeometry(shape, options)
const material = new THREE.MeshBasicMaterial({color: 0xffdddbca});
const mesh = new THREE.Mesh(geometry, material);
mesh.updateMatrix()
// 倒角
const shapeD = new THREE.Shape();
shapeD.moveTo(-0.02, -0.02);
shapeD.lineTo(0.02, 0.02)
shapeD.lineTo(-0.02, 0.02)
shapeD.closePath()
const curveD = new THREE.EllipseCurve(
0, 0, radius, radius, 0, Math.PI * 2, false, 0
);
// 生成拉伸路径点
const pointsD = curveD.getPoints(segments).map(p =>
new THREE.Vector3(p.x, 0.20, p.y)
);
// 3. 挤出成型
const optionsD = {
steps: segments,
bevelEnabled: false,
// bevelSegments: 0.01,
extrudePath: new THREE.CatmullRomCurve3(pointsD)
};
const geometryD = new THREE.ExtrudeGeometry(shapeD, optionsD)
const meshD = new THREE.Mesh(geometryD, material);
meshD.updateMatrix()
// 布尔运算
const result = CSG.subtract(mesh, meshD)
return result.geometry
}
// 创建ptr的立柱
createPtrPillar(item: ItemJson, option?: RendererCudOption): THREE.BufferGeometry {
// 606.5
const width = 0.245
const depth = 0.716
const dd = 0.05
const shape = new THREE.Shape();
shape.moveTo(-0.728, -0.358 + dd);
shape.lineTo(-0.728 + dd, -0.358);
shape.lineTo(-0.728 + width - dd, -0.358);
shape.lineTo(-0.728 + width, -0.358 + dd);
shape.lineTo(-0.728 + width, -0.28);
shape.lineTo(-0.728 + width - 0.08, -0.28);
shape.lineTo(-0.728 + width - 0.08, 0.28);
shape.lineTo(-0.728 + width, 0.28);
shape.lineTo(-0.728 + width, -0.358 + depth - dd);
shape.lineTo(-0.728 + width - dd, -0.358 + depth);
shape.lineTo(-0.728 + dd, -0.358 + depth);
shape.lineTo(-0.728, -0.358 + depth - dd);
// shape.lineTo(-0.728, -0.358 + dd);
// shape.closePath()
// 拉伸轨迹线
const curve = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.22, 0), new THREE.Vector3(0, 1.872, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const options = {
steps: 1,
bevelSegments: 0.05,
bevelEnabled: true,
extrudePath: curve // 设置挤出轨迹
}
// 创建挤出几何体
const geometry = new THREE.ExtrudeGeometry(shape, options)
// const material = new THREE.MeshBasicMaterial({color: 0xffdddbca});
// const mesh = new THREE.Mesh(geometry, material);
const fd = 0.03
const shapeBf = new THREE.Shape();
shapeBf.moveTo(-0.728 + width - 0.08, -0.28);
shapeBf.lineTo(-0.728 + width + 0.02, -0.28);
shapeBf.lineTo(-0.728 + width + 0.02, -0.25);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130 - fd, -0.25);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130, -0.25 + fd);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130, -0.14 - fd);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130 - fd, -0.14);
shapeBf.lineTo(-0.728 + width + 0.02, -0.14);
shapeBf.lineTo(-0.728 + width + 0.02, 0.14);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130 - fd, 0.14);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130, 0.14 + fd);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130, 0.25 - fd);
shapeBf.lineTo(-0.728 + width + 0.02 + 1.130 - fd, 0.25);
shapeBf.lineTo(-0.728 + width + 0.02, 0.25);
shapeBf.lineTo(-0.728 + width + 0.02, 0.28);
shapeBf.lineTo(-0.728 + width - 0.08, 0.28);
shapeBf.closePath()
// 拉伸轨迹线
const curveBf = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.02, 0), new THREE.Vector3(0, 0.06, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const optionsBf = {
steps: 1,
bevelSegments: 0.05,
bevelEnabled: true,
extrudePath: curveBf // 设置挤出轨迹
}
// 创建挤出几何体
const geometryBf = new THREE.ExtrudeGeometry(shapeBf, optionsBf)
return mergeGeometries([geometry, geometryBf])
}
// 创建ptr的立柱
createPtrFork(item: ItemJson, option?: RendererCudOption): THREE.BufferGeometry {
// 606.5
const width = 0.245
const depth = 0.716
const dd = 0.05
const fd = 0.03
const shape = new THREE.Shape();
shape.moveTo(-0.728 + width - 0.08, -0.28);
shape.lineTo(-0.728 + width + 0.02, -0.28);
shape.lineTo(-0.728 + width + 0.02, -0.27);
shape.lineTo(-0.728 + width + 0.02 + 1.130 - fd, -0.27);
shape.lineTo(-0.728 + width + 0.02 + 1.130, -0.27 + fd);
shape.lineTo(-0.728 + width + 0.02 + 1.130, -0.12 - fd);
shape.lineTo(-0.728 + width + 0.02 + 1.130 - fd, -0.12);
shape.lineTo(-0.728 + width + 0.02, -0.12);
shape.lineTo(-0.728 + width + 0.02, 0.12);
shape.lineTo(-0.728 + width + 0.02 + 1.130 - fd, 0.12);
shape.lineTo(-0.728 + width + 0.02 + 1.130, 0.12 + fd);
shape.lineTo(-0.728 + width + 0.02 + 1.130, 0.27 - fd);
shape.lineTo(-0.728 + width + 0.02 + 1.130 - fd, 0.27);
shape.lineTo(-0.728 + width + 0.02, 0.27);
shape.lineTo(-0.728 + width + 0.02, 0.28);
shape.lineTo(-0.728 + width - 0.08, 0.28);
shape.closePath()
// 拉伸轨迹线
const curve = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.02, 0), new THREE.Vector3(0, 0.482, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const options = {
steps: 1,
bevelSegments: 0.05,
bevelEnabled: true,
extrudePath: curve // 设置挤出轨迹
}
// 创建挤出几何体
const geometry = new THREE.ExtrudeGeometry(shape, options)
const material = new THREE.MeshBasicMaterial({color: 0xffdddbca});
const mesh = new THREE.Mesh(geometry, material);
mesh.updateMatrix()
const shapeD = new THREE.Shape();
shapeD.moveTo(-0.728 + width + 0.02, -0.3);
shapeD.lineTo(-0.728 + width + 0.02 + 1.2, -0.3);
shapeD.lineTo(-0.728 + width + 0.02 + 1.2, 0.3);
shapeD.lineTo(-0.728 + width + 0.02, 0.3);
shape.closePath()
// 拉伸轨迹线
const curveD = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.07, 0), new THREE.Vector3(0, 0.482, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const optionsD = {
steps: 1,
bevelSegments: 0.05,
bevelEnabled: true,
extrudePath: curveD // 设置挤出轨迹
}
// 创建挤出几何体
const geometryD = new THREE.ExtrudeGeometry(shapeD, optionsD)
const meshD = new THREE.Mesh(geometryD, material);
meshD.updateMatrix()
// 布尔运算
const result = CSG.subtract(mesh, meshD)
return result.geometry
}
} }

447
src/modules/clx/Clx3dObject.ts
View File

@ -0,0 +1,447 @@
import * as THREE from "three";
import {CSG} from "three-csg-ts";
//@ts-ignore
import {mergeGeometries} from 'three/addons/utils/BufferGeometryUtils.js'
export default class Clx3dObject extends THREE.Object3D {
// 创建clx的底座
private static createClxPedestal(): THREE.BufferGeometry {
const width = 1.65
const depth = 1.65
const dd = 0.05
const bd = 0.175
const shape = new THREE.Shape();
shape.moveTo(-width/2, -depth/2 + bd);
shape.lineTo(-width/2 + bd, -depth/2);
shape.lineTo(width/2 - bd, -depth/2);
shape.lineTo(width/2, -depth/2 + bd);
shape.lineTo(width/2, -0.285);
shape.lineTo(-0.475, -0.285);
shape.lineTo(-0.475, -0.125);
shape.lineTo(width/2, -0.125);
shape.lineTo(width/2, 0.125);
shape.lineTo(-0.475, 0.125);
shape.lineTo(-0.475, 0.285);
shape.lineTo(width/2, 0.285);
shape.lineTo(width/2, depth/2 - bd);
shape.lineTo(width/2 - bd, depth/2);
shape.lineTo(-width/2 + bd, depth/2);
shape.lineTo(-width/2, depth/2 - bd);
shape.closePath(); // 闭合路径
// 拉伸轨迹线
const curve = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.02, 0), new THREE.Vector3(0, 0.22, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const options = {
steps: 1,
bevelEnabled: false,
extrudePath: curve // 设置挤出轨迹
}
// 创建挤出几何体
const geometry = new THREE.ExtrudeGeometry(shape, options)
const material = new THREE.MeshBasicMaterial({color: 0xffdddbca});
const mesh = new THREE.Mesh(geometry, material);
mesh.updateMatrix()
// 倒角
const shapeD = new THREE.Shape();
shapeD.moveTo(-0.02, -0.02);
shapeD.lineTo(0.02, 0.02)
shapeD.lineTo(-0.02, 0.02)
shapeD.closePath()
const shapeDW = new THREE.Shape();
shapeDW.moveTo(0.02, -0.02);
shapeDW.lineTo(0.02, 0.02)
shapeDW.lineTo(-0.02, 0.02)
shapeDW.closePath()
const shapeDW1 = new THREE.Shape();
shapeDW1.moveTo(-0.02, -0.02);
shapeDW1.lineTo(0.02, -0.02)
shapeDW1.lineTo(-0.02, 0.02)
shapeDW1.closePath()
const positionDs:THREE.Vector3[] = [
new THREE.Vector3(-width / 2, 0.20, -depth / 2 + bd),
new THREE.Vector3(-width / 2 + bd, 0.20, -depth / 2),
new THREE.Vector3(width / 2 - bd, 0.20, -depth / 2),
new THREE.Vector3(width / 2, 0.20, -depth / 2 + bd),
new THREE.Vector3(width / 2, 0.20, depth / 2 - bd),
new THREE.Vector3(width / 2 - bd, 0.20, depth / 2),
new THREE.Vector3(-width / 2 + bd, 0.20, depth / 2),
new THREE.Vector3(-width / 2, 0.20, depth / 2 - bd),
new THREE.Vector3(-width / 2, 0.20, -depth / 2 + bd)
]
let result: THREE.Mesh = mesh
for (let i = 0; i < positionDs.length - 1; i++) {
const curveD = new THREE.CatmullRomCurve3([positionDs[i], positionDs[i+1]],
false,
'catmullrom',
0)
const optionsD = {
steps: 1,
bevelEnabled: false,
extrudePath: curveD
};
let geometryD: THREE.BufferGeometry = null
if (i == 1) {
geometryD = new THREE.ExtrudeGeometry(shapeDW, optionsD)
} else if (i == 5) {
geometryD = new THREE.ExtrudeGeometry(shapeDW1, optionsD)
} else {
geometryD = new THREE.ExtrudeGeometry(shapeD, optionsD)
}
const meshD = new THREE.Mesh(geometryD, material);
meshD.updateMatrix()
result = CSG.subtract(result, meshD)
}
return result.geometry
}
// 创建clx的立柱
private static createClxPillar(): THREE.BufferGeometry {
// 606.5
const width = 0.3
const depth = 1.188
const dd = 0.05
const shape = new THREE.Shape();
shape.moveTo(-0.744, -0.594 + dd);
shape.lineTo(-0.744 + dd, -0.594);
shape.lineTo(-0.744 + width - dd, -0.594);
shape.lineTo(-0.744 + width, -0.594 + dd);
shape.lineTo(-0.744 + width, -0.4);
shape.lineTo(-0.744 + width - 0.08, -0.4);
shape.lineTo(-0.744 + width - 0.08, 0.4);
shape.lineTo(-0.744 + width, 0.4);
shape.lineTo(-0.744 + width, -0.594 + depth - dd);
shape.lineTo(-0.744 + width - dd, -0.594 + depth);
shape.lineTo(-0.744 + dd, -0.594 + depth);
shape.lineTo(-0.744, -0.594 + depth - dd);
// shape.lineTo(-0.728, -0.594 + dd);
// shape.closePath()
// 拉伸轨迹线
const curve = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.22, 0), new THREE.Vector3(0, 3.357, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const options = {
steps: 1,
bevelSegments: 0.05,
bevelEnabled: true,
extrudePath: curve // 设置挤出轨迹
}
// 创建挤出几何体
// const material = new THREE.MeshBasicMaterial({color: 0xffdddbca});
// const mesh = new THREE.Mesh(geometry, material);
return new THREE.ExtrudeGeometry(shape, options)
}
// 创建clx的叉
private static createClxFork(): THREE.BufferGeometry {
// 606.5
const width = 0.3
const depth = 1.188
const dd = 0.05
const fdx = 0.06
const fdy = 0.03
const shape = new THREE.Shape();
shape.moveTo(-0.744 + width - 0.08, -0.4);
shape.lineTo(-0.744 + width + 0.02, -0.4);
shape.lineTo(-0.744 + width + 0.02, -0.275);
shape.lineTo(-0.744 + width + 0.02 + 1.24 - fdx, -0.275);
shape.lineTo(-0.744 + width + 0.02 + 1.24, -0.275 + fdy);
shape.lineTo(-0.744 + width + 0.02 + 1.24, -0.135 - fdy);
shape.lineTo(-0.744 + width + 0.02 + 1.24 - fdx, -0.135);
shape.lineTo(-0.744 + width + 0.02, -0.135);
shape.lineTo(-0.744 + width + 0.02, 0.135);
shape.lineTo(-0.744 + width + 0.02 + 1.24 - fdx, 0.135);
shape.lineTo(-0.744 + width + 0.02 + 1.24, 0.135 + fdy);
shape.lineTo(-0.744 + width + 0.02 + 1.24, 0.275 - fdy);
shape.lineTo(-0.744 + width + 0.02 + 1.24 - fdx, 0.275);
shape.lineTo(-0.744 + width + 0.02, 0.275);
shape.lineTo(-0.744 + width + 0.02, 0.4);
shape.lineTo(-0.744 + width - 0.08, 0.4);
shape.closePath()
// 拉伸轨迹线
const curve = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.02, 0), new THREE.Vector3(0, 1.287, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const options = {
steps: 1,
bevelSegments: 0.05,
bevelEnabled: true,
extrudePath: curve // 设置挤出轨迹
}
// 创建挤出几何体
const geometry = new THREE.ExtrudeGeometry(shape, options)
const material = new THREE.MeshBasicMaterial({color: 0xffdddbca});
const mesh = new THREE.Mesh(geometry, material);
mesh.updateMatrix()
const shapeD = new THREE.Shape();
shapeD.moveTo(-0.744 + width + 0.02, -0.3);
shapeD.lineTo(-0.744 + width + 0.02 + 1.3, -0.3);
shapeD.lineTo(-0.744 + width + 0.02 + 1.3, 0.3);
shapeD.lineTo(-0.744 + width + 0.02, 0.3);
shape.closePath()
// 拉伸轨迹线
const curveD = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.07, 0), new THREE.Vector3(0, 1.3, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const optionsD = {
steps: 1,
bevelSegments: 0.05,
bevelEnabled: true,
extrudePath: curveD // 设置挤出轨迹
}
// 创建挤出几何体
const geometryD = new THREE.ExtrudeGeometry(shapeD, optionsD)
const meshD = new THREE.Mesh(geometryD, material);
meshD.updateMatrix()
// 布尔运算
const result = CSG.subtract(mesh, meshD)
return result.geometry
}
// 创建clx的铰链
private static createClxGemel(isLeft: boolean = false) {
const width = 0.08
const depth = 0.9
const dd = 0.02
const shape = new THREE.Shape();
shape.moveTo(-width/2, -depth/2 + dd);
shape.lineTo(-width/2 + dd, -depth/2);
shape.lineTo(width/2 - dd, -depth/2);
shape.lineTo(width/2, -depth/2 + dd);
shape.lineTo(width/2, depth/2 - dd);
shape.lineTo(width/2 - dd, depth/2);
shape.lineTo(-width/2 + dd, depth/2);
shape.lineTo(-width/2, depth/2 - dd);
shape.closePath()
const shapeBar = new THREE.Shape();
shapeBar.moveTo(0, 0); // 起点在圆心
shapeBar.absarc(0, 0, 0.02, 0, Math.PI * 2, false); // 从0到π绘制半圆
shapeBar.closePath()
const geometries: THREE.BufferGeometry[] = []
const curveL1 = new THREE.CatmullRomCurve3(
[new THREE.Vector3(-0.35 + (isLeft ? 0.05 : 0), 0, 0), new THREE.Vector3(-0.30 + (isLeft ? 0.05 : 0), 0, 0)],
false, // 闭合曲线
'catmullrom',
0
)
const curveL2 = new THREE.CatmullRomCurve3(
[new THREE.Vector3(-0.15 + (isLeft ? 0.05 : 0), 0, 0), new THREE.Vector3(-0.1 + (isLeft ? 0.05 : 0), 0, 0)],
false, // 闭合曲线
'catmullrom',
0
)
const curveL3 = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0.15 - (isLeft ? 0.05 : 0), 0, 0), new THREE.Vector3(0.1 - (isLeft ? 0.05 : 0), 0, 0)],
false, // 闭合曲线
'catmullrom',
0
)
const curveL4 = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0.30 - (isLeft ? 0.05 : 0), 0, 0), new THREE.Vector3(0.35 - (isLeft ? 0.05 : 0), 0, 0)],
false, // 闭合曲线
'catmullrom',
0
)
if (!isLeft) {
const curveBar1 = new THREE.CatmullRomCurve3(
[new THREE.Vector3(-0.36, -0.4, 0), new THREE.Vector3(0.36, -0.4, 0)],
false, // 闭合曲线
'catmullrom',
0
)
const curveBar2 = new THREE.CatmullRomCurve3(
[new THREE.Vector3(-0.36, 0, 0), new THREE.Vector3(0.36, 0, 0)],
false, // 闭合曲线
'catmullrom',
0
)
const curveBar3 = new THREE.CatmullRomCurve3(
[new THREE.Vector3(-0.36, 0.4, 0), new THREE.Vector3(0.36, 0.4, 0)],
false, // 闭合曲线
'catmullrom',
0
)
geometries.push(new THREE.ExtrudeGeometry(shapeBar, {
steps: 1,
bevelEnabled: false,
extrudePath: curveBar1
}))
geometries.push(new THREE.ExtrudeGeometry(shapeBar, {
steps: 1,
bevelEnabled: false,
extrudePath: curveBar2
}))
geometries.push(new THREE.ExtrudeGeometry(shapeBar, {
steps: 1,
bevelEnabled: false,
extrudePath: curveBar3
}))
}
const geometryL1 = new THREE.ExtrudeGeometry(shape, {
steps: 1,
bevelEnabled: false,
extrudePath: curveL1
});
const geometryL2 = new THREE.ExtrudeGeometry(shape, {
steps: 1,
bevelEnabled: false,
extrudePath: curveL2
});
const geometryL3 = new THREE.ExtrudeGeometry(shape, {
steps: 1,
bevelEnabled: false,
extrudePath: curveL3
});
const geometryL4 = new THREE.ExtrudeGeometry(shape, {
steps: 1,
bevelEnabled: false,
extrudePath: curveL4
});
geometries.push(geometryL1, geometryL2, geometryL3, geometryL4)
return mergeGeometries(geometries)
}
private static clxPedestalGeometry: THREE.BufferGeometry = null
private static clxPillarGeometry: THREE.BufferGeometry = null
private static clxForkGeometry: THREE.BufferGeometry = null
private static clxGemelGeometryL: THREE.BufferGeometry = null;
private static clxGemelGeometryR: THREE.BufferGeometry = null;
constructor(item: ItemJson, option?: RendererCudOption) {
super()
if (!Clx3dObject.clxPedestalGeometry) {
Clx3dObject.clxPedestalGeometry = Clx3dObject.createClxPedestal()
}
const clxPedestalGeometry = Clx3dObject.clxPedestalGeometry
const clxPedestalMaterial = new THREE.MeshPhongMaterial({color: 0xffdddbca});
const clxPedestalMesh = new THREE.Mesh(clxPedestalGeometry, clxPedestalMaterial);
if (!Clx3dObject.clxPillarGeometry) {
Clx3dObject.clxPillarGeometry = Clx3dObject.createClxPillar()
}
const clxPillarGeometry = Clx3dObject.clxPillarGeometry
const clxPillarMaterial = new THREE.MeshPhongMaterial({color: 0xff6c6956});
const clxPillarMesh = new THREE.Mesh(clxPillarGeometry, clxPillarMaterial);
if (!Clx3dObject.clxForkGeometry) {
Clx3dObject.clxForkGeometry = Clx3dObject.createClxFork()
}
const clxForkGeometry = Clx3dObject.clxForkGeometry;
const clxForkMaterial = new THREE.MeshPhongMaterial({color: 0xff444444});
const clxForkMesh = new THREE.Mesh(clxForkGeometry, clxForkMaterial);
clxForkMesh.name = 'clxFork'
if (!Clx3dObject.clxGemelGeometryL) {
Clx3dObject.clxGemelGeometryL = Clx3dObject.createClxGemel(true)
}
const clxGemelGeometryL = Clx3dObject.clxGemelGeometryL
if (!Clx3dObject.clxGemelGeometryR) {
Clx3dObject.clxGemelGeometryR = Clx3dObject.createClxGemel(false)
}
const clxGemelGeometryR = Clx3dObject.clxGemelGeometryR
const clxGemelMaterial = new THREE.MeshPhongMaterial({color: 0xff555555});
const clxGemelMeshL1 = new THREE.Mesh(clxGemelGeometryL, clxGemelMaterial);
clxGemelMeshL1.name = 'clxGemelMeshL1'
const clxGemelMeshL2 = new THREE.Mesh(clxGemelGeometryL, clxGemelMaterial);
clxGemelMeshL2.name = 'clxGemelMeshL2'
const clxGemelMeshR1 = new THREE.Mesh(clxGemelGeometryR, clxGemelMaterial);
clxGemelMeshR1.name = 'clxGemelMeshR1'
const clxGemelMeshR2 = new THREE.Mesh(clxGemelGeometryR, clxGemelMaterial);
clxGemelMeshR2.name = 'clxGemelMeshR2'
const d = 0
this.add(clxPedestalMesh)
this.add(clxPillarMesh)
this.add(clxForkMesh)
const ac = Math.asin(d/(2 * 0.8))
clxGemelMeshL1.position.z = 0.5 - d/4
clxGemelMeshL1.position.y = 0.72
clxGemelMeshL1.rotation.x = -ac
clxGemelMeshL2.position.z = 0.5 - d/4 * 3
clxGemelMeshL2.position.y = 0.72
clxGemelMeshL2.rotation.x = -ac
clxGemelMeshR1.position.z = 0.5 - d/4
clxGemelMeshR1.position.y = 0.72
clxGemelMeshR1.rotation.x = ac
clxGemelMeshR2.position.z = 0.5 - d/4 * 3
clxGemelMeshR2.position.y = 0.72
clxGemelMeshR2.rotation.x = ac
this.add(clxGemelMeshL1)
this.add(clxGemelMeshL2)
this.add(clxGemelMeshR1)
this.add(clxGemelMeshR2)
}
}

436
src/modules/clx/ClxRenderer.ts
View File

@ -1,14 +1,7 @@
import * as THREE from 'three' import * as THREE from 'three'
import BaseRenderer from '@/core/base/BaseRenderer.ts' import BaseRenderer from '@/core/base/BaseRenderer.ts'
import { Line2 } from 'three/examples/jsm/lines/Line2.js'
import { LineGeometry } from 'three/examples/jsm/lines/LineGeometry.js'
import { LineMaterial } from 'three/examples/jsm/lines/LineMaterial.js'
import { decimalSumBy } from '@/core/ModelUtils'
import Constract from '@/core/Constract.ts' import Constract from '@/core/Constract.ts'
import clxUrl from '@/assets/images/ptr/clx.png' import Clx3dObject from "@/modules/clx/Clx3dObject";
import {CSG} from "three-csg-ts";
//@ts-ignore
import { mergeGeometries } from 'three/addons/utils/BufferGeometryUtils.js'
/** /**
* clx渲染器 * clx渲染器
@ -63,78 +56,9 @@ export default class ClxRenderer extends BaseRenderer {
return return
} }
const textureLoader = new THREE.TextureLoader() const group = new Clx3dObject(item, option)
const texture = textureLoader.load(clxUrl)
const group = new THREE.Group()
group.name = ClxRenderer.POINT_NAME group.name = ClxRenderer.POINT_NAME
// 绘制背景矩形框
const planeGeometry = new THREE.PlaneGeometry(item.dt.clxWidth, item.dt.clxDepth)
planeGeometry.rotateX(-Math.PI / 2)
const planeMaterial = new THREE.MeshLambertMaterial({
map: texture, // 颜色贴图
transparent: true // 允许透明纹理
})
const planeMesh = new THREE.Mesh(planeGeometry, planeMaterial)
// group.add(planeMesh)
const clxPedestalGeometry = this.createClxPedestal(item, option)
const clxPedestalMaterial = new THREE.MeshPhongMaterial({color: 0xffdddbca});
const clxPedestalMesh = new THREE.Mesh(clxPedestalGeometry, clxPedestalMaterial);
const clxPillarGeometry = this.createClxPillar(item, option);
const clxPillarMaterial = new THREE.MeshPhongMaterial({color: 0xff6c6956});
const clxPillarMesh = new THREE.Mesh(clxPillarGeometry, clxPillarMaterial);
const clxForkGeometry = this.createClxFork(item, option);
const clxForkMaterial = new THREE.MeshPhongMaterial({color: 0xff444444});
const clxForkMesh = new THREE.Mesh(clxForkGeometry, clxForkMaterial);
const clxGemelGeometryL =this.createClxGemel(true)
const clxGemelGeometryR =this.createClxGemel(false)
const clxGemelMaterial = new THREE.MeshPhongMaterial({color: 0xff555555});
const clxGemelMeshL1 = new THREE.Mesh(clxGemelGeometryL, clxGemelMaterial);
const clxGemelMeshL2 = new THREE.Mesh(clxGemelGeometryL, clxGemelMaterial);
const clxGemelMeshR1 = new THREE.Mesh(clxGemelGeometryR, clxGemelMaterial);
const clxGemelMeshR2 = new THREE.Mesh(clxGemelGeometryR, clxGemelMaterial);
const d = 1.5
group.add(clxPedestalMesh)
const groupPillar = new THREE.Group()
groupPillar.add(clxPillarMesh)
clxForkMesh.position.z = -d
groupPillar.add(clxForkMesh)
const ac = Math.asin(d/(2 * 0.8))
clxGemelMeshL1.position.z = 0.5 - d/4
clxGemelMeshL1.position.y = 0.72
clxGemelMeshL1.rotation.x = -ac
clxGemelMeshL2.position.z = 0.5 - d/4 * 3
clxGemelMeshL2.position.y = 0.72
clxGemelMeshL2.rotation.x = -ac
clxGemelMeshR1.position.z = 0.5 - d/4
clxGemelMeshR1.position.y = 0.72
clxGemelMeshR1.rotation.x = ac
clxGemelMeshR2.position.z = 0.5 - d/4 * 3
clxGemelMeshR2.position.y = 0.72
clxGemelMeshR2.rotation.x = ac
groupPillar.add(clxGemelMeshL1)
groupPillar.add(clxGemelMeshL2)
groupPillar.add(clxGemelMeshR1)
groupPillar.add(clxGemelMeshR2)
group.add(groupPillar)
// 设置位置 // 设置位置
group.position.set(item.tf[0][0], item.tf[0][1], item.tf[0][2]) group.position.set(item.tf[0][0], item.tf[0][1], item.tf[0][2])
return group return group
@ -149,360 +73,4 @@ export default class ClxRenderer extends BaseRenderer {
throw new Error('Clx createPointBasic not allow!') throw new Error('Clx createPointBasic not allow!')
} }
// 创建clx的底座
createClxPedestal(item: ItemJson, option?: RendererCudOption): THREE.BufferGeometry {
const width = 1.65
const depth = 1.65
const dd = 0.05
const bd = 0.175
const shape = new THREE.Shape();
shape.moveTo(-width/2, -depth/2 + bd);
shape.lineTo(-width/2 + bd, -depth/2);
shape.lineTo(width/2 - bd, -depth/2);
shape.lineTo(width/2, -depth/2 + bd);
shape.lineTo(width/2, -0.285);
shape.lineTo(-0.475, -0.285);
shape.lineTo(-0.475, -0.125);
shape.lineTo(width/2, -0.125);
shape.lineTo(width/2, 0.125);
shape.lineTo(-0.475, 0.125);
shape.lineTo(-0.475, 0.285);
shape.lineTo(width/2, 0.285);
shape.lineTo(width/2, depth/2 - bd);
shape.lineTo(width/2 - bd, depth/2);
shape.lineTo(-width/2 + bd, depth/2);
shape.lineTo(-width/2, depth/2 - bd);
shape.closePath(); // 闭合路径
// 拉伸轨迹线
const curve = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.02, 0), new THREE.Vector3(0, 0.22, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const options = {
steps: 1,
bevelEnabled: false,
extrudePath: curve // 设置挤出轨迹
}
// 创建挤出几何体
const geometry = new THREE.ExtrudeGeometry(shape, options)
const material = new THREE.MeshBasicMaterial({color: 0xffdddbca});
const mesh = new THREE.Mesh(geometry, material);
mesh.updateMatrix()
// 倒角
const shapeD = new THREE.Shape();
shapeD.moveTo(-0.02, -0.02);
shapeD.lineTo(0.02, 0.02)
shapeD.lineTo(-0.02, 0.02)
shapeD.closePath()
const shapeDW = new THREE.Shape();
shapeDW.moveTo(0.02, -0.02);
shapeDW.lineTo(0.02, 0.02)
shapeDW.lineTo(-0.02, 0.02)
shapeDW.closePath()
const shapeDW1 = new THREE.Shape();
shapeDW1.moveTo(-0.02, -0.02);
shapeDW1.lineTo(0.02, -0.02)
shapeDW1.lineTo(-0.02, 0.02)
shapeDW1.closePath()
const positionDs:THREE.Vector3[] = [
new THREE.Vector3(-width / 2, 0.20, -depth / 2 + bd),
new THREE.Vector3(-width / 2 + bd, 0.20, -depth / 2),
new THREE.Vector3(width / 2 - bd, 0.20, -depth / 2),
new THREE.Vector3(width / 2, 0.20, -depth / 2 + bd),
new THREE.Vector3(width / 2, 0.20, depth / 2 - bd),
new THREE.Vector3(width / 2 - bd, 0.20, depth / 2),
new THREE.Vector3(-width / 2 + bd, 0.20, depth / 2),
new THREE.Vector3(-width / 2, 0.20, depth / 2 - bd),
new THREE.Vector3(-width / 2, 0.20, -depth / 2 + bd)
]
let result: THREE.Mesh = mesh
for (let i = 0; i < positionDs.length - 1; i++) {
const curveD = new THREE.CatmullRomCurve3([positionDs[i], positionDs[i+1]],
false,
'catmullrom',
0)
const optionsD = {
steps: 1,
bevelEnabled: false,
extrudePath: curveD
};
let geometryD: THREE.BufferGeometry = null
if (i == 1) {
geometryD = new THREE.ExtrudeGeometry(shapeDW, optionsD)
} else if (i == 5) {
geometryD = new THREE.ExtrudeGeometry(shapeDW1, optionsD)
} else {
geometryD = new THREE.ExtrudeGeometry(shapeD, optionsD)
}
const meshD = new THREE.Mesh(geometryD, material);
meshD.updateMatrix()
result = CSG.subtract(result, meshD)
}
return result.geometry
}
// 创建clx的立柱
createClxPillar(item: ItemJson, option?: RendererCudOption): THREE.BufferGeometry {
// 606.5
const width = 0.3
const depth = 1.188
const dd = 0.05
const shape = new THREE.Shape();
shape.moveTo(-0.744, -0.594 + dd);
shape.lineTo(-0.744 + dd, -0.594);
shape.lineTo(-0.744 + width - dd, -0.594);
shape.lineTo(-0.744 + width, -0.594 + dd);
shape.lineTo(-0.744 + width, -0.4);
shape.lineTo(-0.744 + width - 0.08, -0.4);
shape.lineTo(-0.744 + width - 0.08, 0.4);
shape.lineTo(-0.744 + width, 0.4);
shape.lineTo(-0.744 + width, -0.594 + depth - dd);
shape.lineTo(-0.744 + width - dd, -0.594 + depth);
shape.lineTo(-0.744 + dd, -0.594 + depth);
shape.lineTo(-0.744, -0.594 + depth - dd);
// shape.lineTo(-0.728, -0.594 + dd);
// shape.closePath()
// 拉伸轨迹线
const curve = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.22, 0), new THREE.Vector3(0, 3.357, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const options = {
steps: 1,
bevelSegments: 0.05,
bevelEnabled: true,
extrudePath: curve // 设置挤出轨迹
}
// 创建挤出几何体
const geometry = new THREE.ExtrudeGeometry(shape, options)
// const material = new THREE.MeshBasicMaterial({color: 0xffdddbca});
// const mesh = new THREE.Mesh(geometry, material);
return geometry
}
// 创建clx的叉
createClxFork(item: ItemJson, option?: RendererCudOption): THREE.BufferGeometry {
// 606.5
const width = 0.3
const depth = 1.188
const dd = 0.05
const fdx = 0.06
const fdy = 0.03
const shape = new THREE.Shape();
shape.moveTo(-0.744 + width - 0.08, -0.4);
shape.lineTo(-0.744 + width + 0.02, -0.4);
shape.lineTo(-0.744 + width + 0.02, -0.275);
shape.lineTo(-0.744 + width + 0.02 + 1.24 - fdx, -0.275);
shape.lineTo(-0.744 + width + 0.02 + 1.24, -0.275 + fdy);
shape.lineTo(-0.744 + width + 0.02 + 1.24, -0.135 - fdy);
shape.lineTo(-0.744 + width + 0.02 + 1.24 - fdx, -0.135);
shape.lineTo(-0.744 + width + 0.02, -0.135);
shape.lineTo(-0.744 + width + 0.02, 0.135);
shape.lineTo(-0.744 + width + 0.02 + 1.24 - fdx, 0.135);
shape.lineTo(-0.744 + width + 0.02 + 1.24, 0.135 + fdy);
shape.lineTo(-0.744 + width + 0.02 + 1.24, 0.275 - fdy);
shape.lineTo(-0.744 + width + 0.02 + 1.24 - fdx, 0.275);
shape.lineTo(-0.744 + width + 0.02, 0.275);
shape.lineTo(-0.744 + width + 0.02, 0.4);
shape.lineTo(-0.744 + width - 0.08, 0.4);
shape.closePath()
// 拉伸轨迹线
const curve = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.02, 0), new THREE.Vector3(0, 1.287, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const options = {
steps: 1,
bevelSegments: 0.05,
bevelEnabled: true,
extrudePath: curve // 设置挤出轨迹
}
// 创建挤出几何体
const geometry = new THREE.ExtrudeGeometry(shape, options)
const material = new THREE.MeshBasicMaterial({color: 0xffdddbca});
const mesh = new THREE.Mesh(geometry, material);
mesh.updateMatrix()
const shapeD = new THREE.Shape();
shapeD.moveTo(-0.744 + width + 0.02, -0.3);
shapeD.lineTo(-0.744 + width + 0.02 + 1.3, -0.3);
shapeD.lineTo(-0.744 + width + 0.02 + 1.3, 0.3);
shapeD.lineTo(-0.744 + width + 0.02, 0.3);
shape.closePath()
// 拉伸轨迹线
const curveD = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0, 0.07, 0), new THREE.Vector3(0, 1.3, 0)],
false, // 闭合曲线
'catmullrom',
0
)
// 挤出几何图形 参数
const optionsD = {
steps: 1,
bevelSegments: 0.05,
bevelEnabled: true,
extrudePath: curveD // 设置挤出轨迹
}
// 创建挤出几何体
const geometryD = new THREE.ExtrudeGeometry(shapeD, optionsD)
const meshD = new THREE.Mesh(geometryD, material);
meshD.updateMatrix()
// 布尔运算
const result = CSG.subtract(mesh, meshD)
return result.geometry
}
// 创建clx的铰链
createClxGemel(isLeft: boolean = false) {
const width = 0.08
const depth = 0.9
const dd = 0.02
const shape = new THREE.Shape();
shape.moveTo(-width/2, -depth/2 + dd);
shape.lineTo(-width/2 + dd, -depth/2);
shape.lineTo(width/2 - dd, -depth/2);
shape.lineTo(width/2, -depth/2 + dd);
shape.lineTo(width/2, depth/2 - dd);
shape.lineTo(width/2 - dd, depth/2);
shape.lineTo(-width/2 + dd, depth/2);
shape.lineTo(-width/2, depth/2 - dd);
shape.closePath()
const shapeBar = new THREE.Shape();
shapeBar.moveTo(0, 0); // 起点在圆心
shapeBar.absarc(0, 0, 0.02, 0, Math.PI * 2, false); // 从0到π绘制半圆
shapeBar.closePath()
const geometries: THREE.BufferGeometry[] = []
const curveL1 = new THREE.CatmullRomCurve3(
[new THREE.Vector3(-0.35 + (isLeft ? 0.05 : 0), 0, 0), new THREE.Vector3(-0.30 + (isLeft ? 0.05 : 0), 0, 0)],
false, // 闭合曲线
'catmullrom',
0
)
const curveL2 = new THREE.CatmullRomCurve3(
[new THREE.Vector3(-0.15 + (isLeft ? 0.05 : 0), 0, 0), new THREE.Vector3(-0.1 + (isLeft ? 0.05 : 0), 0, 0)],
false, // 闭合曲线
'catmullrom',
0
)
const curveL3 = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0.15 - (isLeft ? 0.05 : 0), 0, 0), new THREE.Vector3(0.1 - (isLeft ? 0.05 : 0), 0, 0)],
false, // 闭合曲线
'catmullrom',
0
)
const curveL4 = new THREE.CatmullRomCurve3(
[new THREE.Vector3(0.30 - (isLeft ? 0.05 : 0), 0, 0), new THREE.Vector3(0.35 - (isLeft ? 0.05 : 0), 0, 0)],
false, // 闭合曲线
'catmullrom',
0
)
if (!isLeft) {
const curveBar1 = new THREE.CatmullRomCurve3(
[new THREE.Vector3(-0.36, -0.4, 0), new THREE.Vector3(0.36, -0.4, 0)],
false, // 闭合曲线
'catmullrom',
0
)
const curveBar2 = new THREE.CatmullRomCurve3(
[new THREE.Vector3(-0.36, 0, 0), new THREE.Vector3(0.36, 0, 0)],
false, // 闭合曲线
'catmullrom',
0
)
const curveBar3 = new THREE.CatmullRomCurve3(
[new THREE.Vector3(-0.36, 0.4, 0), new THREE.Vector3(0.36, 0.4, 0)],
false, // 闭合曲线
'catmullrom',
0
)
geometries.push(new THREE.ExtrudeGeometry(shapeBar, {
steps: 1,
bevelEnabled: false,
extrudePath: curveBar1
}))
geometries.push(new THREE.ExtrudeGeometry(shapeBar, {
steps: 1,
bevelEnabled: false,
extrudePath: curveBar2
}))
geometries.push(new THREE.ExtrudeGeometry(shapeBar, {
steps: 1,
bevelEnabled: false,
extrudePath: curveBar3
}))
}
const geometryL1 = new THREE.ExtrudeGeometry(shape, {
steps: 1,
bevelEnabled: false,
extrudePath: curveL1
});
const geometryL2 = new THREE.ExtrudeGeometry(shape, {
steps: 1,
bevelEnabled: false,
extrudePath: curveL2
});
const geometryL3 = new THREE.ExtrudeGeometry(shape, {
steps: 1,
bevelEnabled: false,
extrudePath: curveL3
});
const geometryL4 = new THREE.ExtrudeGeometry(shape, {
steps: 1,
bevelEnabled: false,
extrudePath: curveL4
});
geometries.push(geometryL1, geometryL2, geometryL3, geometryL4)
return mergeGeometries(geometries)
}
} }

Write Preview
Loading…
Cancel
Save