javascript - Three.jsで2dパスを3d形状に変換する方法は?

Question

私はこれの3dを持っている必要があります: http://jsfiddle.net/dAdKm/
しかし、このコードを使用すると:

var shape = new THREE.Shape();
shape.moveTo(20,20);
shape.bezierCurveTo(20, 100, 150, 100, 150, 20);
shape.moveTo(20,20);
shape.lineTo(20, 100);
shape.lineTo(150, 100);
shape.lineTo(150, 20);

var shape3d = shape.extrude(extrudeSettings);
var shapePoints = shape.createPointsGeometry();
var shapeSpacedPoints = shape.createSpacedPointsGeometry();
var material = new THREE.MeshBasicMaterial({ color: 0x0000ff });
var shapeMesh = new THREE.Mesh(shape3d, material);

結果は 2D コンテキストの結果と同じではありません。なぜですか? 何が問題ですか？

Answer 1

形状は（20、20）で始まり、（150、20）に進み、次に（20、20）に「ジャンプ」します。

ジャンプを避け、代わりに次の形状定義を試してください。

var shape = new THREE.Shape();
shape.moveTo(20,20);
shape.bezierCurveTo(20, 100, 150, 100, 150, 20);
shape.lineTo(150, 100);
shape.lineTo(20, 100);
shape.moveTo(20,20);