Three.js tree

by Dan Shahin

JavaScript

var camera, scene, renderer, geometry, material, mesh;


// init() and animate() at the bottom after proctree.js....

function init() {

var tree = new Tree({"seed":861,
"segments":10,
"levels":3,
"vMultiplier":0.66,
"twigScale":0.47,
"initalBranchLength":0.5,
"lengthFalloffFactor":0.85,
"lengthFalloffPower":0.99,
"clumpMax":0.449,
"clumpMin":0.404,
"branchFactor":2.75,
"dropAmount":0.07,
"growAmount":-0.005,
"sweepAmount":0.01,
"maxRadius":0.269,
"climbRate":0.626,
"trunkKink":0.108,
"treeSteps":4,
"taperRate":0.876,
"radiusFalloffRate":0.66,
"twistRate":2.7,
"trunkLength":1.55,
"trunkMaterial":"TrunkType2",
"twigMaterial":"BranchType5"});
    
    scene = new THREE.Scene();

    camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 10000);
    camera.position.z = 500;
    scene.add(camera);
    var texturepath = 0;
    
    var model = {
      "metadata" : {
      "formatVersion" : 3.1,
      "generatedBy"	: "bb3d2proctree",
      "vertices"		: 0,
      "faces"			: 0,
      "description"	: "Autogenerated from proctree."
      },
      "materials": [{ // just testing...
      "diffuse": 20000
      }],
      "colors": [0xff00ff, 0xff0000] // just testing
    };
    
    model.vertices = Tree.flattenArray(tree.verts);
    model.normals  = Tree.flattenArray(tree.normals);
    model.uvs      = [Tree.flattenArray(tree.UV)];
    
    model.faces    = Tree.flattenArray(tree.faces);
    // should we do something about the faces?
    if (window.console) {
        window.console.log("faces from proctree look like this:");
      window.console.log(model.faces);
    }
    
    /* 
    for (var i = 0; i < model.faces.length; i++) {
      var face = model.faces[i];
    }
    */
    
    
    var loader = new THREE.JSONLoader();
    loader.createModel(model, function(geometry, materials) {
    
      // var mesh = new THREE.Mesh( geometry, materials[0]);
      mesh = new THREE.Mesh( geometry, new THREE.MeshBasicMaterial({color: 0xFF0000}));
     ...