当前位置: 动力学知识库 > 问答 > 编程问答 >

three.js - make filled polygon using spline curve

问题描述:

How make a a filled polygon using SplineCurve in Three.js

I had tried to to feed point list to make a Three.Shape but it doesnt work because of some problem with the triangulation "Unable to triangulate polygon". I know spline act as curve not as path that can be closed. So is there any way I can fill the lower part of the spline with a different color for the image shown below.

I want the spline to be cut the back side of the box. Is there anyway I can fill the lower and upper portion of the curve with different material or color.

I dont know the spline approach is good here. If not please correct me

网友答案:

Curve :

var line = new THREE.SplineCurve( 
                [

                  new THREE.Vector2( 30, 12),
                  new THREE.Vector2( 40, 20),
                  new THREE.Vector2( 60, 40),
                  new THREE.Vector2( 10, 60),
                  new THREE.Vector2( 25, 80)

                ]);

Shape :

var shape = new THREE.Shape(line.getSpacedPoints(100));

Shape geometry and mesh :

var geometry = new THREE.ShapeGeometry( shape );

var mesh = THREE.SceneUtils.createMultiMaterialObject( geometry, [ new THREE.MeshLambertMaterial( { color: 0xeeeeee } )] );

Second possible approach is to create custom geometry and color faces. Custom geometry you can create with Blender and export or add vertices and faces yourself.

分享给朋友:
您可能感兴趣的文章:
随机阅读: