vector - Threejs - 如何按距离偏移二维几何上的所有点
问题描述
使用 Three.js,(尽管我相信这与数学更相关)我有一组可以创建 2D 几何的 2D 点。例如正方形、矩形、五边形或自定义 2D 形状。基于原始的 2D 形状,我想创建一种方法来均匀地向内或向外偏移点,就像所附图像一样。
我不知道是否有一种简单的方法可以向内或向外均匀地偏移/增长/收缩 2D 形状上的所有点(vector3)。如果是这样,如果我可以将这些点偏移 X 距离会很酷吗?有点像说将 2D 形状上的点向外或向内偏移 X 距离。
不,我不是指从中心点缩放。虽然缩放可能适用于对称形状,但它不适用于非对称形状。
提前致谢。
解决方案
您可以阅读该论坛主题。
我已经对ProfiledContourGeometry
和 got进行了一些更改OffsetContour
,所以我把它留在这里,以防万一,如果它有帮助怎么办:)
function OffsetContour(offset, contour) {
let result = [];
offset = new THREE.BufferAttribute(new Float32Array([offset, 0, 0]), 3);
console.log("offset", offset);
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;
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, 0, 0, 1
);
let translationMatrix = new THREE.Matrix4().set(
1, 0, 0, contour[i].x,
0, 1, 0, contour[i].y,
0, 0, 1, 0,
0, 0, 0, 1,
);
let cloneOffset = offset.clone();
console.log("cloneOffset", cloneOffset);
shiftMatrix.applyToBufferAttribute(cloneOffset);
rotationMatrix.applyToBufferAttribute(cloneOffset);
translationMatrix.applyToBufferAttribute(cloneOffset);
result.push(new THREE.Vector2(cloneOffset.getX(0), cloneOffset.getY(0)));
}
return result;
}
随意修改它:)
推荐阅读
- kubernetes - 如何负载平衡在 2 个 Pod 上运行的有状态应用程序
- javascript - 如果数据存在并在 JQuery 中自动更改今天日期,则今天日期在 datepicker 中突出显示
- javascript - 在 javascript 中从 php 获取 json_encode
- java - 当我们将其设置为高优先级时,Daemon 线程的行为如何?
- javascript - 如何在对象数组中找到对象?
- java - 如何在 Spring Boot 中使用 KafkaTemplate 创建多个生产者,每个生产者用于不同的 Kafka 服务器
- python - 如果用户输入不在范围内,如何使用while循环?
- sql-server - 间歇性数据库连接错误 - RDS - MSSQL
- c# - 这是处理异常的好方法。即使用 Try Block When 您可以实际处理异常并从中恢复?
- java - 我需要为 recyclerview 项目制作比例动画吗?