如何在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);