Need a review to improve this :)

please format code with </> button * homework policy * asking questions

Hello,
I need some help, i have done this job , could you tell me how i can make my code better ?

Here is the code, it s juste some tips to improve my work :slight_smile: What would you change ? How could you get the code more readable ?

Thanks a lot for help ! :slight_smile:


float fwidth = 1254/10;
float fheight = 862/10;
float zoom = 1;
int mouseTransX = 0;
int mouseTransY = 0;
boolean hoverSlider = false;

/* Tableaux avec les coordonnées des checkpoints et des routes */
float [][] checkpointcoord = {
  // 1 Basilica S Pietro 2 Castle Sant Angelo 3 Pantheon 4 Quirinale 5 Piazza della repubblica 6 Arco Di Tito 7 Collosseo 8 Isola Tiberina  
  {fwidth*1.55, fwidth*2.75, fwidth*4.42, fwidth*5.7, fwidth*7.46, fwidth*6.06, fwidth*6.7, fwidth*4.47}, 
  {fheight*3.9, fheight*3.9, fheight*4.99, fheight*4.35, fheight*3.82, fheight*6.84, fheight*7.66, fheight*7.89}, 
};
float [][] roadcoord = {
  { fwidth*1.55, fwidth*2.75, fwidth*2.79, fwidth*3.93, fwidth*3.93, fwidth*4.43, fwidth*4.43, fwidth*4.82, fwidth*4.9, fwidth*5.7, fwidth*6.06, fwidth*6.38, fwidth*7.02, fwidth*7.46, fwidth*7.71, fwidth*7.27, fwidth*7.63, fwidth*7.02, fwidth*6.06, fwidth*6.66, fwidth*6.70, fwidth*6.42, fwidth*5.02, fwidth*4.92, fwidth*4.59, fwidth*4.47, fwidth*4.15, fwidth*3.83, fwidth*3.43, fwidth*2.63, fwidth*1.83, fwidth*1.69
  }, 
  { fheight*3.9, fheight*3.9, fheight*4.52, fheight*4.56, fheight*4.85, fheight*4.84, fheight*4.99, fheight*4.99, fheight*4.76, fheight*4.35, fheight*3.94, fheight*3.83, fheight*4.52, fheight*3.82, fheight*4.24, fheight*4.8, fheight*5.2, fheight*6.38, fheight*6.84, fheight*7.40, fheight*7.66, fheight*9.37, fheight*7.95, fheight*8.06, fheight*8.06, fheight*7.89, fheight*7.71, fheight*7.66, fheight*7.31, fheight*6.07, fheight*4.17, fheight*4.17
  }, 

  { fwidth*2.75, fwidth*2.79, fwidth*3.93, fwidth*3.93, fwidth*4.43, fwidth*4.42, fwidth*4.82, fwidth*4.9, fwidth*5.7, fwidth*6.06, fwidth*6.38, fwidth*7.02, fwidth*7.46, fwidth*7.71, fwidth*7.27, fwidth*7.63, fwidth*7.02, fwidth*6.06, fwidth*6.66, fwidth*6.7, fwidth*6.42, fwidth*5.02, fwidth*4.92, fwidth*4.59, fwidth*4.47, fwidth*4.15, fwidth*3.83, fwidth*3.43, fwidth*2.63, fwidth*1.83, fwidth*1.69, fwidth*1.55
  }, 
  { fheight*3.9, fheight*4.52, fheight*4.56, fheight*4.85, fheight*4.84, fheight*4.99, fheight*4.99, fheight*4.76, fheight*4.35, fheight*3.94, fheight*3.83, fheight*4.52, fheight*3.82, fheight*4.24, fheight*4.8, fheight*5.2, fheight*6.38, fheight*6.84, fheight*7.4, fheight*7.66, fheight*9.37, fheight*7.95, fheight*8.06, fheight*8.06, fheight*7.89, fheight*7.71, fheight*7.66, fheight*7.31, fheight*6.07, fheight*4.17, fheight*4.17, fheight*3.90
  }, 
};
Checkpoint [] allCheckpoint = new Checkpoint[checkpointcoord[0].length];
Road [] allRoad = new Road[roadcoord[0].length];
Slider slider1 = new Slider();

void setup() {
  size(1254, 862);
  strokeWeight(2);
  textSize(24);
  for (int i = 0; i < allCheckpoint.length; i++) {
    allCheckpoint[i] = new Checkpoint(checkpointcoord[0][i], checkpointcoord[1][i]);
  }
  for (int i = 0; i < allRoad.length; i++) {
    allRoad[i] = new Road(roadcoord[0][i], roadcoord[1][i], roadcoord[2][i], roadcoord[3][i]);
  }
}
void draw () {
  clear();
  scale(slider1.valueZoom());
  translate(mouseTransX, mouseTransY);
  
  image(loadImage("roma.jpg"), 0, 0, width, height);
  stroke(255, 0, 0);
  fill(255, 0, 0);
  for (int i = 0; i < allRoad.length; i++) {
    allRoad[i].affichage();
  }
  for (int i = 0; i < allCheckpoint.length; i++) {
    allCheckpoint[i].affichage();
    allCheckpoint[i].popup(slider1.valueZoom());
  }
  if (frameCount%40 >=39) {
    for (int i = 0; i < allCheckpoint.length; i++) {
      allCheckpoint[i].Tourist();
    }
  }
  slider1.affichage();
  fill(0);
  text(frameCount, 100, 150);
}


void mouseDragged() {
  if (hoverSlider == false ) {
    if (pmouseX < mouseX ) {
      mouseTransX += 1;
    }
    if (pmouseX > mouseX) {
      mouseTransX += -1;
      ;
    }
    if (pmouseY < mouseY) {
      mouseTransY +=1;
    }
    if (pmouseY > mouseY) {
      mouseTransY += -1;
    }
  }
}



/* Classe pour les checkpoints du bus ( maximum de touristes par arrêt/ Touristes actuels/ Toutistes qui descendent / Touristes qui montent/ Densité de touriste par arrêt)*/
class Checkpoint {
  float x, y, size;
  int maximum_de_touriste, touriste_courant, touriste_montant, touriste_descendant, densite_touriste;
  Checkpoint(float posX, float posY) {
    x = posX;
    y = posY;
    size = 40;
    maximum_de_touriste = 100;                           /* Maximum de touristes */
    touriste_courant = round(random(10, maximum_de_touriste));   /* Nombre courant de touristes  */
    touriste_montant = round(random(10, maximum_de_touriste/2));     /* Nombre de touristes montant  */
    touriste_descendant = round(random(10, maximum_de_touriste/2));     /* Nombre de touristes descendant  */
    densite_touriste = round(map(touriste_courant, 0, maximum_de_touriste, 0, 100)); /* Densité de touriste */
  }
  /* Méthode pour afficher le point d'arrêt sur la carte selon la densité des touristes avec code couleur */
  void affichage() {
    noStroke();
    if (densite_touriste < 30 ) {
      fill(0, 255, 0, 180);
    } else if (densite_touriste >= 30 && densite_touriste < 70) {
      fill(255, 255, 0, 180);
    } else {
      fill(255, 0, 0, 180);
    }
    ellipse(x, y, densite_touriste, densite_touriste);
  }





  /* MĂ©thode de mise Ă  jour du nombre de touristes au point d'arrĂŞt */
  void Tourist() {
    if (touriste_courant > 100 || touriste_courant <= 0) {
      touriste_courant = round(random(10, 100));
    } else {
      touriste_courant += -touriste_montant + touriste_descendant;
    }
    touriste_descendant = round(random(10, maximum_de_touriste/2));
    touriste_montant = round(random(10, maximum_de_touriste/2));
    densite_touriste = round(map(touriste_courant, 0, maximum_de_touriste, 0, 100));
  }


  /* Classe pour les tronçons */



  void popup (float value) {
    if (dist((x + mouseTransX)*value, (y + mouseTransY)*value, mouseX, mouseY)<100) {
      if (mousePressed) {
        rectMode(CENTER);
        fill(255, 255, 255, 180);
        rect(x + 100, y, 224, 72);
        textSize(16);
        fill(0);
        text(maximum_de_touriste + " :touriste maximum", x +12, y -16);
        text(touriste_courant + " :touriste actuel", x+12, y+4);
        text(densite_touriste +"%" + " : saturation", x+12, y+24);
      }
    }
  }
}
/* Classe slider */
class Slider {
  boolean clicked;
  float value;
  int posLineX, posLineY, size, posx, posy;
  Slider() {
    posLineX = 30;
    posLineY = 30;
    size = 200 + posLineX;
    posx = posLineX;
    posy = posLineY;
    value = 0;
    clicked = false;
  }
  void affichage() {
    translate(-mouseTransX, -mouseTransY);
    fill(200);
    rectMode(CORNER);
    rect(0, 0, width, 60/value);
    stroke(0);
    strokeWeight(1/value);
    line(posLineX/value, posLineY/value, size/value, posLineY/value);
    stroke(125);
    fill(125);
    ellipse(posx/value, posy/value, 20/value, 20/value);
    textSize(16/value);
    text(value * 100 + "%", (size/value) + 20/value, posy/value);
    if (dist(posx, posy, mouseX, mouseY)< 11) {

      if (mousePressed) {
        hoverSlider = true;
        clicked = true;
      }
    }
    if (mousePressed) {
      if (clicked && posx >= posLineX && posx <= size) {

        posx = mouseX;
      }
    }
    if (mousePressed == false) {
      clicked = false;
      hoverSlider = false;
    }

    if (posx < posLineX) {
      posx = posLineX;
    } else if (posx > size) {
      posx = size;
    }
  }

  float valueZoom() {
    value = map(posx, posLineX, size, 1, 4);

    return value;
  }
}
class Road {
  float x1, x2, y1, y2;
  Road(float posX1, float posY1, float posX2, float posY2) {
    x1 = posX1;
    y1 = posY1;
    x2 = posX2;
    y2 = posY2;
  }
  /* Méthode pour afficher le tronçon */
  void affichage() {
    stroke(255, 0, 0);
    line(x1, y1, x2, y2);
  }
}

Hello,

Please format your code:
https://discourse.processing.org/faq#format-your-code

:)

Hello,
thanks for answer, i did what you tell me, sorry for my mistake,
Whats do you think of this code ? Do you think it s possible to improve this ?
Thanks and bests regards

It is a much better presentation!
I am confident others will look at it now.

Don’t be sorry be happy!
It is part of the learning process.

Last day of the year… I may take a look next year.

:)

Counting down (made with Processing):

Looks Nice!

Images:

definitely not in draw(): image(loadImage("roma.jpg"), 0, 0, width, height);

make a global image roma and use loadImage(“roma.jpg”) in setup() only, otherwise slows things down

also use resize() in setup() and use image with 3 parameters only, otherwise slows things down

empty lines

Please use empty lines consistent. Sometimes you have 4 sometimes 0. Use a maximum of 1 and have one empty line between functions and classes

Remark 1

INSIDE class Checkpoint we read /* Classe pour les tronçons */
Are you sure about this?

Remark 2

You can write // ==================== before each class

Remark 3

As an idea:

I would write a headline in your Sketch (when displaying it) like “Busses in Rome”

Also when you have your points such as 1 Basilica S Pietro 2 Castle Sant Angelo 3 Pantheon
I would write it into the map (small print) using text(). (Or is it in your image roma.jpg?)

Also consider to use mouse over instead of clicking on a point to see details.

Also consider to write a small text Click points to see data

Remark 4

void Tourist() {

by convention: methods start with a small letter void tourist() {

Remark 5

Use nf() or round to shorten the percentage number of the slider. Sometimes it shows 203.499998%

Remark 6

here is a faster mouse movement, yours is very slow

void mouseDragged() {
  if (hoverSlider == false ) {
    if (pmouseX < mouseX ) {
      mouseTransX += 10;
    }
    if (pmouseX > mouseX) {
      mouseTransX += -10;
      ;
    }
    if (pmouseY < mouseY) {
      mouseTransY +=10;
    }
    if (pmouseY > mouseY) {
      mouseTransY += -10;
    }
  }
}

Remark 7

Your zoom enlarges from the upper left corner, not from the center. Maybe you can fix it.

Warm regards,

Chrisir

1 Like

Hello,

See post here for a tip:

:)

Hello, thanks a lot for theses notes, i take a look to make the changes :slight_smile: Best wishes for 2021

1 Like

Hello,

You have a lot of data to work with and some duplicate data.
I was curious and cleaned it up (find and replace) and plotted it:

Code
void setup() 
	{
  size(800, 400);
	}

void draw() 
	{
  background(0);
  for(int i = 0; i<= roadcoord.length; i++)
    {
    strokeWeight(5);
    
    stroke(255, 0, 0);
    point(50*roadcoord[0][i], 50*roadcoord[1][i]-100);  
    
    stroke(0, 255, 0);
    point(50*roadcoord[2][i]+400, 50*roadcoord[3][i]-100); 
    
    stroke(255, 255, 0);
    point(50*checkpointcoord[0][i]+400, 50*roadcoord[1][i]+50); 
    

    stroke(255, 0, 0);
    point(50*roadcoord[0][i], 50*roadcoord[1][i]);  
    
    stroke(0, 255, 0);
    point(50*roadcoord[2][i]+5, 50*roadcoord[3][i]); 
    
    stroke(255, 255, 0);
    point(50*checkpointcoord[0][i], 50*roadcoord[1][i]+5); 
    }
	}

image

Data I used:

Now that I can visualize the data set I would consider different ways to store it and use it.

One common set of data and an arrays of indexes (or indices) for the different groups comes to mind.

:)