not good but great

プログラミング、アート、映画・本の感想について書きます。

THREE.jsでConvexGeometryを使う


凸包を扱うConvexGeometryを使ってみました。参考ページを読むと、自力でGeometryを使うのが、一番自由に作成できるみたいですね。

code

//シーンを生成
scene = new THREE.Scene();

for(var i = 0;i < 300;i++){
    // 頂点ベクトルの配列
    var vertices = [];
    for(var j = 0;j < 100;j++){
        vertices.push(new THREE.Vector3( Math.random() * 100, Math.random() * 100, Math.random() * 100));
    }
    geometry = new THREE.ConvexGeometry( vertices );
    material = new THREE.MeshLambertMaterial( { color: 0xffffff, transparent:true, opacity:0.2 } );
    var convex = new THREE.Mesh(geometry,material);// 与えられた頂点から凹みのない立体を作成
    scene.add( convex );
}

長さ100の立方体の中に、図形が集まるようになっています。何かの破片が凝縮したような形になりました。Tweenアニメーションを使って、散らばせたり、集合させたりすると面白いかもしれません。
・参考
three.js wiki - ConvexGeometry