TP5/README.md

@@ -9,10 +9,11 @@
 
 ### Définir les marques
 
-Nous choisisons les attributs "population" et "altitude" pour encoder visuellement les villes. Voici comment nous pourrions associer une variable rétinienne à chaque attribut :
+Nous choisisons les attributs "population" et "altiteude" pour encoder visuellement les villes. Voici comment nous pourrions associer une variable rétinienne à chaque attribut :
 
 - Population : la variable rétinienne associée à la population sera la taille du marqueur. Ainsi, une ville avec une population plus élevée aurait une marque plus grande qu'une ville avec une population plus faible.
 
 - Altitude : la variable rétinienne associée à l'altitude sera la couleur du marqueur. Par exemple, les villes ayant une altitude plus élevée seront représentées par des marqueurs jaunes à rouge, tandis que les villes ayant une altitude plus basse seront représentées par des marqueurs bleus.
 
 On met en place aussi un histogramme des valeurs de population, c'est-à-dire le nombre de valeurs appartenant à chaque intervalle de l'axe afin d'améliorer la visualisation des données.
+ 
\ No newline at end of file

TP5/sketch_240321a/City.pde

@@ -8,6 +8,7 @@ class City {
       float altitude;
       float radius=0;
       boolean isHighlighted=false;
+      boolean isClicked=false;
 
       // put a drawing function in here and call from main drawing loop }
       public City(String postalcode, String name, float x, float y, float population, float surface, float altitude) { 
@@ -45,7 +46,14 @@ class City {
       float rectHeight = 20;
       fill(255);
       rect(x + radius/2 + 5, y - rectHeight/2, rectWidth, rectHeight, 5);
-      fill(0);
+      
+      if(isClicked){
+        colorMode(RGB);
+        fill(255, 0, 0);
+      }
+      else {
+        fill(0);
+      }
       text(name, x + radius/2 + 10, y - 2);
       setBasePen();
   }

TP5/sketch_240321a/ColorPalette.pde

@@ -3,6 +3,7 @@ float getColorForAltitude(float altitude) {
 }
 
 void setBasePen() {
+    colorMode(HSB);
     fill(0);
     textSize(12);
 }

TP5/sketch_240321a/sketch_240321a.pde

@@ -13,81 +13,88 @@ int y = 2;
 City cities[];
 
 int legendsHeight=100;
-int minPopulationToDisplay=10000;
+int minPopulationToDisplay=1;
+int maxPopulationToDisplay=300000;
 boolean redrawInProgress=false;
 City lastCitySelected=null;
+City lastCityClicked=null;
+
+float sliderX, sliderY, sliderWidth, sliderHeight;
+float sliderPositionMin, sliderPositionMax;
+boolean draggingSlider = false;
+boolean draggingMin = false;
 
 void setup() {
   size(900,900);
   colorMode(HSB, 360, 100, 100);
   readData();
   noLoop();
+  
+  sliderX = 50;
+  sliderY = 50;
+  sliderWidth = width - 100;
+  sliderHeight = 20;
+  // Initialise les positions des curseurs sur le slider
+  sliderPositionMin = map(minPopulationToDisplay, minPopulation, maxPopulation, sliderX, sliderX + sliderWidth);
+  sliderPositionMax = map(maxPopulationToDisplay, minPopulation, maxPopulation, sliderX, sliderX + sliderWidth);
 }
 
-void draw(){
-  background(255);
-  
-  // Draw title
-  fill(0);
-  textSize(20);
-  textAlign(CENTER,CENTER);
-  text("Afficher les populations supérieures à " + minPopulationToDisplay, width/2, 20);
-  setBasePen();
-  
-  for (int i = 0 ; i < totalCount; ++i) {
-    // draw a point at the coordinates of the city
-    cities[i].draw();
-  }
+void draw() {
+  if (!redrawInProgress) {
+    background(255);
+    fill(0);
+    textSize(20);
+    textAlign(CENTER, CENTER);
+    text("Afficher les populations entre " + minPopulationToDisplay + " et " + maxPopulationToDisplay, width/2, 20);
+    setBasePen();
+    
+    drawSlider();
+
+    // Vérifiez que l'indice est valide
+    for (int i = 0; i < Math.min(totalCount, cities.length); ++i) {
+      cities[i].draw();
+    }
 
-  updatePixels();
-  
-  // Draw the distribution of the altitude values
-  float[] altitudeValues = new float[cities.length];
-  for (int i = 0; i < totalCount; i++) {
-    altitudeValues[i] = cities[i].altitude;
+    updatePixels();
+    
+    if (legendsHeight > 0) {
+      drawLegend();
+    }
   }
+}
 
-  if (legendsHeight > 0) {
-    drawLegend();
-  }
-  redrawInProgress=false;
+void drawSlider() {
+  fill(180);
+  rect(sliderX, sliderY, sliderWidth, sliderHeight);
+
+  fill(255, 0, 0); // Poignée pour le minimum
+  ellipse(sliderPositionMin, sliderY + sliderHeight / 2, 20, 20);
+  fill(0, 255, 0); // Poignée pour le maximum
+  ellipse(sliderPositionMax, sliderY + sliderHeight / 2, 20, 20);
 }
 
 void readData() {
-  redrawInProgress=true;
-  String[] lines = loadStrings("./villes.tsv");
-  
-  // check that the file has been loaded
-  if (lines == null) {
-    println("Error loading file");
-    exit();
-  } else {
-    println("File loaded");
-  }
-  
-  parseInfo(lines[0]); // read the header line
-  
   ArrayList<City> filteredCities = new ArrayList<City>();
+  String[] lines = loadStrings("./villes.tsv");
 
-  for (int i = 2 ; i < totalCount ; ++i) {
-    String[] columns = split(lines[i], TAB);
-      float pointX = float (columns[x]);
-      float pointY = float (columns[y]);
-      // filter the cities
-      if (float (columns[5]) > minPopulationToDisplay) {
-        filteredCities.add(new City(columns[0], columns[4], mapX(pointX), mapY(pointY), float (columns[5]), float (columns[6]), float (columns[7])));
+  if (lines != null && lines.length > 2) {
+    parseInfo(lines[0]);
+    for (int i = 2; i < lines.length; i++) {
+      String[] columns = split(lines[i], TAB);
+      float population = float(columns[5]);
+      if (population >= minPopulationToDisplay && population <= maxPopulationToDisplay) {
+        filteredCities.add(new City(columns[0], columns[4], mapX(float(columns[x])), mapY(float(columns[y])), population, float(columns[6]), float(columns[7])));
       }
+    }
   }
-  
-  totalCount = filteredCities.size();
-  cities = filteredCities.toArray(new City[0]);
-  println("City list created: " + totalCount + " cities");
-
 
+  cities = filteredCities.toArray(new City[filteredCities.size()]);
+  totalCount = filteredCities.size();
+  redrawInProgress = false;
 }
 
 void parseInfo(String line) {
-  String infoString = line.substring(2); // remove the #
+  String infoString = line.substring(2);
   String[] infoPieces = split(infoString, ',');
   totalCount = int(infoPieces[0]);
   minX = float(infoPieces[1]);
@@ -166,6 +173,50 @@ void mouseMoved() {
   }
 }
 
+void mousePressed(){
+  float distMin = dist(mouseX, mouseY, sliderPositionMin, sliderY + sliderHeight / 2);
+  float distMax = dist(mouseX, mouseY, sliderPositionMax, sliderY + sliderHeight / 2);
+
+  if (distMin < 10) {
+    draggingSlider = true;
+    draggingMin = true;
+  } else if (distMax < 10) {
+    draggingSlider = true;
+    draggingMin = false;
+  }
+}
+
+void mouseDragged() {
+  if (draggingSlider) {
+    boolean updateData = false;
+    if (draggingMin) {
+      float newPos = constrain(mouseX, sliderX, sliderPositionMax);
+      if (newPos != sliderPositionMin) {
+        sliderPositionMin = newPos;
+        minPopulationToDisplay = int(map(sliderPositionMin, sliderX, sliderX + sliderWidth, minPopulation, maxPopulation));
+        updateData = true;
+      }
+    } else {
+      float newPos = constrain(mouseX, sliderPositionMin, sliderX + sliderWidth);
+      if (newPos != sliderPositionMax) {
+        sliderPositionMax = newPos;
+        maxPopulationToDisplay = int(map(sliderPositionMax, sliderX, sliderX + sliderWidth, minPopulation, maxPopulation));
+        updateData = true;
+      }
+    }
+    if (updateData) {
+      readData(); // Modifier pour ne lire les données que si nécessaire
+      redraw(); // Limitez le redessin aux moments nécessaires
+    }
+  }
+}
+
+void mouseReleased() {
+  draggingSlider = false;
+  redraw(); // Assurez-vous de redessiner une dernière fois à la fin du déplacement
+}
+
+
 
 City pick(int px, int py) {
   for (int i = totalCount - 1 ; i >= 0; --i) {