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

Question

How to make all three corners ( created using shape.absarc) of the Three.js Shape go out and not in?

See 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);

One corner goes 'out', but two go 'in'. How do you make all the corners bulge out?

Answer 1

Here is one way to create an extruded shape from a path.

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