I am new to the processing environment, was trying to build a visualizer for bubble sort. I have some questions regarding it -
- Is the visualization and drawing of the rectangles correct?
- How do I color the rectangles different that are being compared currently?
- Is this can be done in java using Swing or any native libraries (i.e without processing)? If yes, please provide some resources.
int totalNum = 10;
int[] values = new int[totalNum];
int i = 1;
int noOfComp = 0;
void draw() {
float rectPos = 0;
frameRate(10);
background(255);
for (int i = 0; i< totalNum; i++) {
//text(values[i], rectPos , values[i]);
stroke(220);
fill(50);
rect(rectPos, height - values[i], width / totalNum, values[i]);
rectPos += width / totalNum;
}
textSize(20);
text("No. Of Comparisons: ", 15, 40);
text(noOfComp, 80, 60);
bubbleSort();
}
void bubbleSort() {
if (i < totalNum) {
if (values[i] < values[i-1] && noOfComp++ > 0) {
fill(255,5,5);
swap(i, i-1);
delay(100);
}
i++;
} else {
i = 1;
}
}
void swap(int a, int b) {
int temp = values[a];
values[a] = values[b];
values[b] = temp;
}
void setup() {
size(700, 700);
for (int i = 0; i< totalNum; i++) {
values[i] = round(random(0, height));
}
}
Is the visualization and drawing of the rectangles correct?
That's opinion-based. But it works, so yes it is. The code is well structured and follows the basic guidelines.
How do I color the rectangles different that are being compared currently?
Yov've to set an individual color by fill() before the rectangles is draw. A color consists of a red, green and blue channel. The channels are mixed to the final color. If all 3 channels have the same scale, then the color is a gray scale color. (0, 0, 0) is black and (255, 255, 255) is white.
e.g. Color the rectangles which are compared in red and all the others in gray. The rectangles which are compared have the indices i and i-1.
Since the control variables of the for loop is also named i, this has to be changed (e.g. j):
for (int j = 0; j < totalNum; j++) {
// [...]
}
Compare the index i to the control variable j. If j==i-1 or j==i then set the red fill color (fill(255, 0, 0)) else the gray color (fill(127)):
for (int j = 0; j < totalNum; j++) {
stroke(220);
if (j==i-1 || j==i) {
fill(255, 0, 0);
} else {
fill(127);
}
rect(rectPos, height - values[j], width / totalNum, values[j]);
rectPos += width / totalNum;
}
If you just want to color the "swapped" rectangles, the you've to identify when noOfComp has changed. State the previous swap count in a variable prevNoOfComp, before bubbleSort is called. Just use a different color if the swap count has changed (if (noOfComp != prevNoOfComp && (j==i-1 || j==i))):
int noOfComp = 0;
int prevNoOfComp = 0;
void draw() {
float rectPos = 0;
frameRate(10);
background(255);
for (int j = 0; j < totalNum; j++) {
stroke(220);
if (noOfComp != prevNoOfComp && (j==i-1 || j==i)) {
fill(255, 0, 0);
} else {
fill(127);
}
rect(rectPos, height - values[j], width / totalNum, values[j]);
rectPos += width / totalNum;
}
textSize(12);
text("No. Of Comparisons: ", 15, 40);
text(noOfComp, 80, 60);
prevNoOfComp = noOfComp;
bubbleSort();
}
[...] can be done in java using Swing or any native libraries
Questions asking us to recommend or find a book, tool, software library, tutorial or other off-site resource are off-topic for Stack Overflow as they tend to attract opinionated answers and spam. Instead, describe the problem and what has been done so far to solve it.