- [webgl]Three.jsでポリゴンを描画するには
- 今となっては内容が古く、そのままのソースでは今どきのthree.jsは動かない。
- ElectronでWebGL(three.js)使ってデスクトップマスコット作った際に分かったこと
- CI環境のNightmareでWebGLを動かす方法や、NightmareでWebGL 2.0を動かす方法
- Windows10のBlenderをアップデートしたらThree.jsのアドオンが無くなったが、見つけた
- Three.jsでexamplesの高級車たちをblenderにExportしたが残念な結果に
- gopherくんのjsonデータがthree.jsのr85以降表示されなくてはまったjsonデータがthree.jsのr85以降表示されなくてはまった
- Ammo.jsのbtRaycastVehicleを基準にしたThree.jsのカメラの指定ではまった件
1年以上前の版からのケース
- addLightとかないからaddでOK
- addChildもない、groupを使う模様
- THREE.Vertexは廃止なので、Vector3を直でgeometry.verticesに頂点登録する
u,vパラメータで表した数式からジオメトリー情報を作成してくれそう ->試した
var pCount=0;
var geom = new THREE.Geometry();
var v1 = new THREE.Vector3(10, 10, 0);
var v2 = new THREE.Vector3(10, -10, 0);
var v3 = new THREE.Vector3(-10, -10, 0);
geom.vertices.push(v1);
geom.vertices.push(v2);
geom.vertices.push(v3);
var face1 = new THREE.Face3(pCount, pCount+1, pCount+2);
// 頂点毎の法線ベクトルの設定
var faceNormal = new THREE.Vector3(0,0,-1);
face1.normal.copy(faceNormal);
face1.vertexNormals.push(faceNormal.clone(),faceNormal.clone(),faceNormal.clone());
face1.materialIndex = 0;
// 面データの追加
geom.faces.push(face1);
geom.computeBoundingSphere();