1 Replies - 3065 Views - Last Post: 19 April 2013 - 05:59 AM

#1 celine123  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 30-October 12

Linear Interpolation (Processing)

Posted 17 April 2013 - 10:41 AM

I have been going crazy for the past 3 days and now i only have 2 hours until my submission deadline!!!

Part A: Linear Interpolation.
a) Write a Processing program that allows the user to input points using the mouse until a key is pressed. Show the linear interpolation as the user creates it (i.e. for each point that is input, show the resulting line).
B) Create a variation of the sketch in a) that shows a circle moving along the interpolated path. When the circle hits one end of the path, let it go back the other way.

class pts{
  public int x; 
  public int y;
  pts(int a, int B)/>{
    x = a; 
    y = b;
  int getX(){
    return x;
  int getY(){
    return y;

The class above is a simple class that stores points coord x and y.

  PImage img = loadImage("start.jpeg");
  ArrayList p = new ArrayList();
  boolean b = false;
  void setup(){
    size(500, 500);
  void draw(){
    image(img, 400, 30);
    for(int j=0; j < p.size()-1 ; j++){
      pts p1 = (pts) p.get(j);
      pts p2 = (pts) p.get(j+1);
      ellipse(p1.getX(), p1.getY(), 10, 10);
      ellipse(p2.getX(), p2.getY(), 10, 10);
      line(p1.getX(), p1.getY(), p2.getX(), p2.getY());
    if(b == true){ 
      for(int i=0; i< p.size()-1; i++){    
          pts p3 = (pts) p.get(i);    // call get the ith point
          pts p4 = (pts) p.get(i+1);    // call get the ith point
          int x0 = p3.getX();
          int y0 = p3.getY();          
          int x1 = p4.getX();
          int y1 = p4.getY();
          for(float j=0; j<10; j= j + 0.10){
            float y = interp((float)x0,(float) y0, (float)x1, (float)y1, j);
            ellipse(j, y, 10, 10);
  float interp(float x0, float y0, float x1, float y1, float x){
    float y = y0 + (x - x0) * ((y1-y0)/(x1-x0));
    return y;
  void mousePressed(){  //as draw loops, keep on drawing the same ellipse.
  //check if mouse was clicked above the "start" image 
    if((mouseX >= 400 && mouseX <= 400 + img.width) && (mouseY >= 30 && mouseY<=30+img.height)){
      b = true;
      p.add(new pts(mouseX, mouseY));
      ellipse(mouseX, mouseY, 20, 20);  

I dont know what i am doing wrong! I am successfully drawing the points and join them through lines. When I press the start image, expecting that the circle will go through the path i get nothing!! Please some help (

Thanks in adnvance!

Is This A Good Question/Topic? 0
  • +

Replies To: Linear Interpolation (Processing)

#2 cfoley  Icon User is offline

  • Cabbage
  • member icon

Reputation: 2388
  • View blog
  • Posts: 5,013
  • Joined: 11-December 07

Re: Linear Interpolation (Processing)

Posted 19 April 2013 - 05:59 AM

Processing isn't a functional language. Technically it should go in the "Other Languages" subforum. However, I don't think that many people here will have heard or used Processing. You might have better luck posting threads in the Java forum, even though it's technically not the correct forum.

Asking for help a few days rather than hours before the deadline might help too.

You are using i and j as coordinates instead of retrieving the points that you have stored. You can see the circles appearing at the very edge of your sketch.

You might find it useful to create a class to represent the line with the bouncing circle. It could have the methods animate(), drawLine() and drawCirlce(). This class would handle all the interpolation calculations, leaving your main sketch to deal with things at a higher level.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1