diff --git a/README.md b/README.md
index b073b2aaeedea255b6e581a6cbbaef51c7459540..4c8442c55f92babd5a586235189fed016d7e9681 100644
--- a/README.md
+++ b/README.md
@@ -8,4 +8,6 @@ Le dossier `TP1` comprend le TP1 et le TP2 (expérience contrôlée).
Le dossier `TP3` comprend l'analyse des résultats.
-Le dossier `TP4` comprend le TP "Technique d'entrée de texte".
\ No newline at end of file
+Le dossier `TP4` comprend le TP "Technique d'entrée de texte".
+
+Le dossier `TP5` comprend le TP "Visualisation".
\ No newline at end of file
diff --git a/TP5/README.md b/TP5/README.md
index cfbdde35d4993249e2809e5883455e630cdf85c3..9c81edd5ccf8e2b7168d7df6c8ac7a911e8d683b 100644
--- a/TP5/README.md
+++ b/TP5/README.md
@@ -1,19 +1,24 @@
# Visualisation processing
-## TP1
+## Première paartie
**Enoncé du tp : http://malacria.com/teachings/RVA/visualisation/tpvisu1.html**
-## TP2
+## Deuxième partie
**Enoncé du tp : http://malacria.com/teachings/RVA/visualisation/tpvisu2.html**
### Définir les marques
-Nous choisisons les attributs "population" et "altiteude" pour encoder visuellement les villes. Voici comment nous pourrions associer une variable rétinienne à chaque attribut :
+Nous choisisons les attributs "population" et "altitude" 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
+
+
+## Troisième partie
+**Enoncé du tp : http://malacria.com/teachings/RVA/visualisation/tpvisu3.html**
+
+Je me suis arrêté juste avant la 10eme partie.
\ No newline at end of file
diff --git a/TP5/sketch_240321a/City.pde b/TP5/sketch_240321a/City.pde
index 9a8706562bc8df0c04bba787b393d196a97fcc74..2c6a1f50f0cdbfbc21c08f21f3ac058b980570aa 100644
--- a/TP5/sketch_240321a/City.pde
+++ b/TP5/sketch_240321a/City.pde
@@ -1,4 +1,4 @@
-class City {
+class City {
int postalcode;
String name;
float x;
@@ -10,7 +10,6 @@ class City {
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) {
this.postalcode = Integer.parseInt(postalcode);
this.name = name;
@@ -22,22 +21,16 @@ class City {
}
void draw() {
- //map the altitude to the color in porcentage
float porcentageAlt = map(this.altitude, minAltitude, maxAltitude, 0, 100);
float hue = getColorForAltitude(porcentageAlt);
-
- // Set marker size based on populationxxxx
radius=map(this.population, minPopulation, maxPopulation, 3, 100);
-
- // Draw marker
float alpha = 80;
if(isHighlighted){
alpha=255;
}
fill(hue, 100, 100, alpha);
ellipse(x, y, radius, radius);
-
- // Draw city name
+
if (isHighlighted) {
textSize(16);
textAlign(LEFT, CENTER);
diff --git a/TP5/sketch_240321a/Legends.pde b/TP5/sketch_240321a/Legends.pde
index 68fd3246789212fa9205dc30618df9bcd43efd2f..8c259523dccc676671355f3301a282aebd1025ff 100644
--- a/TP5/sketch_240321a/Legends.pde
+++ b/TP5/sketch_240321a/Legends.pde
@@ -32,7 +32,6 @@ void drawAltitudeLegend(float minVal, float maxVal, float x, float y, float w, f
}
void drawDistributionPopulationLegend(int minPopulation, int maxPopulation, float x, float y, float width, float height, int numberOfDiv, float[] populationValues) {
- // Calcul de l'histogramme
int[] histogram = new int[numberOfDiv];
for (int i = 0; i < populationValues.length; i++) {
int val = (int) map(populationValues[i], minPopulation, maxPopulation, 0, numberOfDiv);
@@ -61,8 +60,6 @@ void drawDistributionPopulationLegend(int minPopulation, int maxPopulation, floa
float barHeight = map(histogram[i], 0, maxHistogram, 0, height);
rect(currentX, y - barHeight, binWidth, barHeight);
}
-
- // Dessin de la légende
// Draw title
fill(0);
diff --git a/TP5/sketch_240321a/sketch_240321a.pde b/TP5/sketch_240321a/sketch_240321a.pde
index 5730006f240f5b4ee02af060ebabdc4992ab5788..e4c41136216f587bb945c3fc9ced3d93b0b84d54 100644
--- a/TP5/sketch_240321a/sketch_240321a.pde
+++ b/TP5/sketch_240321a/sketch_240321a.pde
@@ -1,12 +1,10 @@
//globally
-//declare the min and max variables that you need in parseInfo
float minX, maxX;
float minY, maxY;
-int totalCount; // total number of places
+int totalCount;
int minPopulation, maxPopulation;
int minSurface, maxSurface;
int minAltitude, maxAltitude;
-//declare the variables corresponding to the column ids for x and y
int x = 1;
int y = 2;
@@ -50,7 +48,6 @@ void draw() {
drawSlider();
- // Vérifiez que l'indice est valide
for (int i = 0; i < Math.min(totalCount, cities.length); ++i) {
cities[i].draw();
}
@@ -122,7 +119,6 @@ void drawLegend() {
float distributionY = height - legendsHeight;
float distributionWidth = width - 100;
float distributionHeight = 50;
- // get list of population values from the cities
float[] populationValues = new float[cities.length];
for (int i = 0; i < cities.length - 2; i++) {
populationValues[i] = cities[i].population;
@@ -205,15 +201,15 @@ void mouseDragged() {
}
}
if (updateData) {
- readData(); // Modifier pour ne lire les données que si nécessaire
- redraw(); // Limitez le redessin aux moments nécessaires
+ readData();
+ redraw();
}
}
}
void mouseReleased() {
draggingSlider = false;
- redraw(); // Assurez-vous de redessiner une dernière fois à la fin du déplacement
+ redraw();
}