fractal plant, geometry fixes, 2D view

1 files changed, 14 insertions, 11 deletions

diff --git a/index.html b/index.html
index ab2ea78..e985177 100644
--- a/index.html
+++ b/index.html
@@ -82,6 +82,7 @@ for (var i=0; i<coords.length; i++) {
               <li><a href="#" class="lsys-link" data-lsys="koch_curve" data-dim="2D">Koch Curve</a></li>
               <li><a href="#" class="lsys-link" data-lsys="sierpinski" data-dim="2D">Sierpinski Triangle</a></li>
               <li><a href="#" class="lsys-link" data-lsys="dragon_curve" data-dim="2D">Dragon Curve</a></li>
+              <li><a href="#" class="lsys-link" data-lsys="fractal_plant" data-dim="2D">Fractal Plant</a></li>
             </ul>
           </div>
           <div class="span9">
@@ -97,7 +98,8 @@ for (var i=0; i&lt;coords.length; i++) {
       var lsys_dir = {
         'koch_curve': new LSystem('F', {'F': 'F+F-F-F+F'}).iterate(3).draw(Math.PI/2),
         'sierpinski': new LSystem('A', {'A': 'B-A-B', 'B': 'A+B+A'}, ['A', 'B']).iterate(4).draw(Math.PI/3),
-        'dragon_curve': new LSystem('FX', {'X': 'X+YF', 'Y': 'FX-Y'}).iterate(10).draw(Math.PI/2)
+        'dragon_curve': new LSystem('FX', {'X': 'X+YF', 'Y': 'FX-Y'}).iterate(10).draw(Math.PI/2),
+        'fractal_plant': new LSystem('X', {'X': 'F-[[X]+X]+F[+FX]-X', 'F': 'FF'}).iterate(6).draw(25*(Math.PI/180))
       }
 
       var WIDTH = 500; //window.innerWidth;
@@ -105,7 +107,7 @@ for (var i=0; i&lt;coords.length; i++) {
 
       var container;
       var scene, camera, renderer;
-      var lsys_tree;
+      var lsys_tree, dim;
 
       var mouseX = 0, mouseY = 0;
       var windowHalfX = WIDTH / 2;
@@ -119,7 +121,7 @@ for (var i=0; i&lt;coords.length; i++) {
         scene = new THREE.Scene();
 
         camera = new THREE.PerspectiveCamera(20, WIDTH / HEIGHT, 1, 10000);
-        camera.position.y = 100;
+        //camera.position.y = 100;
         camera.position.z = 100;
         scene.add(camera);
 
@@ -154,9 +156,9 @@ for (var i=0; i&lt;coords.length; i++) {
           new THREE.Geometry()
         ];
 
-        axis_geometry[0] = new THREE.Shape(x_axis).createPointsGeometry();
-        axis_geometry[1] = new THREE.Shape(y_axis).createPointsGeometry();
-        axis_geometry[2] = new THREE.Shape(z_axis).createPointsGeometry();
+        axis_geometry[0].vertices = x_axis;
+        axis_geometry[1].vertices = y_axis;
+        axis_geometry[2].vertices = z_axis;
 
         var axis_material = [
           new THREE.LineBasicMaterial({ color : 0xff0000 }),
@@ -177,17 +179,18 @@ for (var i=0; i&lt;coords.length; i++) {
 
       function draw_lsys(coords) {
         lsys_tree = new THREE.Object3D();
+        var g = new THREE.Geometry();
         for (var i=0; i<coords.length; i++) {
           var branch = [];
           for (var j=0; j<coords[i].length; j++) {
-            branch.push(new THREE.Vector3(coords[i][j][0], coords[i][j][1], coords[i][j][2]));
+            var v = new THREE.Vector3(coords[i][j][0], coords[i][j][1], coords[i][j][2]);
+            g.vertices.push(v);
           }
-          var geometry = new THREE.Shape(branch).createPointsGeometry();
           var material = new THREE.LineBasicMaterial({
             color : 0x111122,
             linewidth : 2
           });
-          var line = new THREE.Line(geometry, material);
+          var line = new THREE.Line(g, material);
           lsys_tree.add(line);
         }
         scene.add(lsys_tree);
@@ -199,7 +202,7 @@ for (var i=0; i&lt;coords.length; i++) {
       }
 
       function render() {
-        if (lsys_tree) {
+        if (lsys_tree && dim == '3D') {
           lsys_tree.rotation.y = mouseX % (20 * Math.PI) / 10;
         }
         camera.lookAt(scene.position);
@@ -207,7 +210,7 @@ for (var i=0; i&lt;coords.length; i++) {
       }
 
       $('a.lsys-link').click(function(e) {
-        var dim = $(this).attr('data-dim');
+        dim = $(this).attr('data-dim');
         var lsys = $(this).attr('data-lsys');
         if (lsys_tree) {
           scene.remove(lsys_tree);