如何使圆弧角出去,而不是在一个Three.js形状

How to make the arc corners go out not in with a Three.js Shape

本文关键字:一个 形状 js Three 何使圆      更新时间:2023-09-26

如何使所有的三个角(使用Shape .absarc创建)的three .js形状走出去,而不是在?

见http://jsfiddle.net/theo/v7v4fu2v/

    // Shape
    var radius = 10;
    var material = new THREE.MeshNormalMaterial();
    pt1 = new THREE.Vector3(40, 50, 0);
    pt2 = new THREE.Vector3(-40, 0, 0);
    pt3 = new THREE.Vector3(30, -20, 0);
    p = pt3.clone().sub(pt1);
    a1 = Math.atan2(p.y, p.x) + Math.PI / 2;
    p = pt2.clone().sub(pt1);
    a2 = Math.atan2(p.y, p.x) - Math.PI / 2;
    p = pt1.clone().sub(pt2);
    a3 = Math.atan2(p.y, p.x) + Math.PI / 2;
    p = pt3.clone().sub(pt2);
    a4 = Math.atan2(p.y, p.x) - Math.PI / 2;
    shape = new THREE.Shape();
    shape.absarc(pt1.x, pt1.y, radius, a1, a2, true);
    shape.absarc(pt2.x, pt2.y, radius, a3, a4, true);
    shape.absarc(pt3.x, pt3.y, radius, a4, a1, true);
    var geometry = shape.extrude({
        amount: 10,
        bevelEnabled: false
    });
    mesh = new THREE.Mesh(geometry, material);
    mesh.position.z = 0;
    scene.add(mesh);

一个角"出去",但两个角"进去"。你是怎么把这些角都凸出来的?

这是一种从路径创建挤压形状的方法。

var path = new THREE.Path();
path.absarc( pt1.x, pt1.y, radius, a1, a2, false );
path.absarc( pt2.x, pt2.y, radius, a3, a4, false );
path.absarc( pt3.x, pt3.y, radius, a4, a1, false );
var points = path.getSpacedPoints( 100 );
var shape = new THREE.Shape( points );
var geometry = new THREE.ExtrudeGeometry( shape, {
    amount: 10,
    bevelEnabled: false
} );
var mesh = new THREE.Mesh( geometry, new THREE.MeshNormalMaterial() );
scene.add( mesh );
http://jsfiddle.net/v7v4fu2v/35/

three.js r.87