Circular Path using Jit.anim.path


    Apr 23 2012 | 8:21 am
    I was wondering if there was a way to get a circular path for an object to move around. I know you can set the interpmode to spline on the jit.anim.path to get rounded edges but the append messages used to draw are giving me a hard time and I cannot seem to get a circular looking path. Is it possible to get something that looks like jit.gl.sketch with a framecircle 3 0 360 message being sent to it? Thanks.

    • May 14 2012 | 3:24 pm
      i made something similar (made a helix spline) with javascript and connected the outlet directly to the jit.anim.path inlet... if you set height to zero, you'll get a circle.
      autowatch = 1;
      inlets = 1;
      outlets = 1;
      var Point3D = function(x,y,z){
      this.x = x;
      this.y = y;
      this.z = z;
      this.toString = function(){
      return "Point3D[ x: "+this.x+", y: "+this.y+", z: "+this.z+" ]";
      }
      return this;
      }
      var Spline3D = function(Point3DArray){
      this.points = Point3DArray;
      if(typeof(this.points)=="undefined"){
      this.points = new Array();
      }
      return this;
      }
      var Helix = function(numPoints, numFrequency, radius, height){
      this.Points = new Array();
      this.radius = radius;
      this.height = height;
      this.freqency = numFrequency;
      this.arcsize = this.freqency / numPoints;
      this.stepsize = this.height / numPoints;
      for(var i = 0; i < numPoints; i++){
      var x = Math.sin(i*this.arcsize * 2 * Math.PI) * this.radius;
      var y = i * this.stepsize;
      var z = Math.cos(i*this.arcsize * 2 * Math.PI) * this.radius - 65.;
      var tmp = new Point3D(x,y,z);
      //post(tmp + "n");
      this.Points[i] = tmp ;
      }
      return this;
      }
      var numPoints = 123.;
      var numFrequency = 1.1;
      var radius = 30.;
      var height = 50.0;
      var time_matrix = new JitterMatrix(1,"float32", numPoints);
      var point_matrix = new JitterMatrix(3,"float32", numPoints);
      var helix = new Helix(numPoints, numFrequency, radius, height);
      function fillMatrix(){
      for(i=0;i
      post(helix.Points[i] + "n");
      x = helix.Points[i].x;
      y = helix.Points[i].y;
      z = helix.Points[i].z;
      time_matrix.setcell1d(i,y*0.05);
      // if you want to add some randomness to the vertical axis
      //y = y - Math.random() * (height/numPoints) *2. - (height / 2.);
      point_matrix.setcell(i,"val",x,y,z);
      }
      }
      function pack(mat1, mat2){
      var packer = new JitterObject("jit.pack");
      packer.offset = [0,0];
      packer.jump = [1,3];
      var outmat = new JitterMatrix(4,"float32",numPoints);
      packer.matrixcalc([mat1,mat2],outmat);
      return outmat;
      }
      fillMatrix();
      bang();
      function bang(){
      outmat = pack(time_matrix,point_matrix);
      outlet(0,"jit_matrix",outmat.name);
      outlet(0,"play",1);
      outlet(0,"rate",-0.5);
      outlet(0,"loop",0);
      }
      now i want to create the jit.anim.path object dynamicly in javascript, but i don't know how to assign the input matrix to the path object., any suggestions? jit.anim.path.matrixcalc does not work...