int[] data = {120, 200, 300, 150, 250}; // Data representing the height of each bar
String[] labels = {"A", "B", "C", "D", "E"}; // Labels for each bar
int numBars = data.length;
float barWidthPercent = 0.1; // Percentage of canvas width occupied by each bar
float maxDataValue;
float barSpacingPercent = 0.02; // Percentage of canvas width for spacing between bars
float xOffsetPercent = 0.1; // Percentage of canvas width for x offset
float yOffsetPercent = 0.1; // Percentage of canvas height for y offset

void setup() {
  size(300, 300);
  maxDataValue = max(data);
}

void draw() {
  background(255);
  
  // Calculate dimensions based on canvas size
  float canvasWidth = width * (1 - 2 * xOffsetPercent);
  float canvasHeight = height * (1 - 2 * yOffsetPercent);
  float barWidth = canvasWidth * barWidthPercent;
  float barSpacing = canvasWidth * barSpacingPercent;
  float xOffset = width * xOffsetPercent;
  float yOffset = height * yOffsetPercent;
  
  // Drawing the bars
  for (int i = 0; i < numBars; i++) {
    float barHeight = (data[i] * canvasHeight) / maxDataValue;
    float barX = xOffset + i * (barWidth + barSpacing);
    float barY = height - yOffset - barHeight;
    color barColor = getColor(i); // Get color based on index
    fill(barColor);
    rect(barX, barY, barWidth, barHeight);
    
    // Display frequency on top of each bar
    fill(0);
    textAlign(CENTER, CENTER);
    text(data[i], barX + barWidth / 2, barY - 10);
    
    // Display label below each bar
    fill(0);
    text(labels[i], barX + barWidth / 2, height - 10);
  }
}

// Function to get color based on index
color getColor(int index) {
  int shade = int(map(index, 0, numBars - 1, 0, 255)); // Map index to a shade of grey and cast to int
  return color(shade);
}