Colour Sensor output send to processing

Hi there,

I am in the process of creating a prototype for a final year project at uni and i'm an Arduino newbie, I was hoping to pull RGB colour values received by an Avago ADJD-S371 colour sensor and send them to processing where a script would allow the user to simply paint on a white canvas with the colour that is being picked up by the colour sensor.

So far I have managed to get the ADJD-S371 hooked up to an arduino with the r,g and b values being picked up by the serial read in arduino software using the following code :

//Configure gain here
//Higher numbers = less sensitive
// 0x00 through 0x0f
int redGain = 0x03;
int greenGain = 0x0;
int blueGain = 0x0f;
int clearGain = 0x01;

//RGB LED pins
//Digital PWM pins
int redPin = 9;
int greenPin = 10;
int bluePin = 11;

//Include the I2C Arduino library
#include <Wire.h>

//7 bit I2C address of this sensor
#define I2C_ADDRESS 0x74

#define REG_CAP_RED		0x06
#define REG_CAP_GREEN	 0x07
#define REG_CAP_BLUE	 0x08
#define REG_CAP_CLEAR	 0x09

#define REG_INT_RED_LO	0x0A
#define REG_INT_RED_HI	0x0B
#define REG_INT_GREEN_LO 0x0C
#define REG_INT_GREEN_HI 0x0D
#define REG_INT_BLUE_LO	0x0E
#define REG_INT_BLUE_HI	0x0F
#define REG_INT_CLEAR_LO 0x10
#define REG_INT_CLEAR_HI 0x11

#define REG_DATA_RED_LO	0x40
#define REG_DATA_RED_HI	0x41
#define REG_DATA_GREEN_LO 0x42
#define REG_DATA_GREEN_HI 0x43
#define REG_DATA_BLUE_LO 0x44
#define REG_DATA_BLUE_HI 0x45
#define REG_DATA_CLEAR_LO 0x46
#define REG_DATA_CLEAR_HI 0x47

float redFactor=1;
float blueFactor=1;
float greenFactor=1;

//initial darkLevel;
int calibrationDarkness = 0;
byte calibrationRed = 5;
byte calibrationGreen = 5;
byte calibrationBlue = 5;

void setup(void){
	Serial.begin(9600);
	Wire.begin();

	// sensor gain setting (Avago app note 5330)
	// CAPs are 4bit (higher value will result in lower output)
	set_register(REG_CAP_RED, redGain);
	set_register(REG_CAP_GREEN, greenGain);
	set_register(REG_CAP_BLUE, blueGain);
	set_register(REG_CAP_CLEAR, clearGain);

	int ledGain = getColorGain();

	set_gain(REG_INT_RED_LO,ledGain);
	set_gain(REG_INT_GREEN_LO,ledGain);
	set_gain(REG_INT_BLUE_LO,ledGain);

	performMeasurement();

	int red=get_readout(REG_DATA_RED_LO);
	int green=get_readout(REG_DATA_GREEN_LO);
	int blue=get_readout(REG_DATA_BLUE_LO);

	int m=2000; //bigger anyway
	m=min(m,red);
	m=min(m,green);
	m=min(m,blue);

	//Serial.print("m - ");
	//Serial.println(m);

	redFactor=((float)m*255.0)/(1000*(float)red);
	greenFactor=((float)m*255.0)/(1000*(float)green);
	blueFactor=((float)m*255.0)/(1000*(float)blue);

}

void loop() { 

	int clearGain = getClearGain();
	set_gain(REG_INT_CLEAR_LO,clearGain);
	int colorGain = getColorGain();
	set_gain(REG_INT_RED_LO,colorGain);
	set_gain(REG_INT_GREEN_LO,colorGain);
	set_gain(REG_INT_BLUE_LO,colorGain);

	//reset the RGB (and clear) values
	int cc = 0;
	int red=0;
	int green=0;
	int blue=0;

	// Take 4 samples, and add them together.
	for (int i=0; i<4 ;i ++) {
		performMeasurement();
		cc +=get_readout(REG_DATA_CLEAR_LO);
		red +=get_readout(REG_DATA_RED_LO);
		green +=get_readout(REG_DATA_GREEN_LO);
		blue +=get_readout(REG_DATA_BLUE_LO);
	}

	//now, divide the totals for each by 4 to get their average.
	cc/=4;
	red /=4;
	green /=4;
	blue /=4;

	//take the values mesured from above, and multiply them with the factors to
	//find out what value should be sent to the external RGB LED to reproduce this color
	float redValue = (float)red*redFactor;
	float greenValue = (float)green*greenFactor;
	float blueValue = (float)blue*blueFactor;

	Serial.print("red: ");
	Serial.print(redValue);

	Serial.print("green: ");
	Serial.print(greenValue);

	Serial.print("blue: ");
	Serial.print(blueValue);

Serial.println();
delay(200);

	//send to LED
	analogWrite(redPin, map(redValue, 0, 1024, 0, 255));
	analogWrite(greenPin, map(greenValue, 0, 1024, 0, 255));
	analogWrite(bluePin, map(blueValue, 0, 1024, 0, 255));	

	//hold it for one second
	delay(500);
}

int getClearGain() {
	int gainFound = 0;
	int upperBox=4096;
	int lowerBox = 0;
	int half;

	while (!gainFound) {
		half = ((upperBox-lowerBox)/2)+lowerBox;

		if (half == lowerBox) { //no further halfing possbile
			break; //no further halfing possbile
		}
		else {
			set_gain(REG_INT_CLEAR_LO,half);
			performMeasurement();
			int halfValue = get_readout(REG_DATA_CLEAR_LO);

			if (halfValue > 1000) {
				upperBox=half;
			}
			else if (halfValue<1000) {
				lowerBox = half;
			}
			else {
				break; //no further halfing possbile
			}
		}
	}
	return half;
}

int getColorGain() {
	int gainFound = 0;
	int upperBox=4096;
	int lowerBox = 0;
	int half;
	while (!gainFound) {
		half = ((upperBox-lowerBox)/2)+lowerBox;

		if (half==lowerBox) { //no further halfing possbile
			break; // gain found
		}
		else {

			set_gain(REG_INT_RED_LO,half);
			set_gain(REG_INT_GREEN_LO,half);
			set_gain(REG_INT_BLUE_LO,half);
			performMeasurement();
			int halfValue = 0;

			halfValue=max(halfValue,get_readout(REG_DATA_RED_LO));
			halfValue=max(halfValue,get_readout(REG_DATA_GREEN_LO));
			halfValue=max(halfValue,get_readout(REG_DATA_BLUE_LO));

			if (halfValue>1000) {
				upperBox=half;

			}
			else if (halfValue<1000) {
				lowerBox=half;

			}
			else {
				break; // gain found
			}
		}
	}
	return half;
}

void performMeasurement() {
	set_register(0x00,0x01); // start sensing

	while(read_register(0x00) != 0) {
		// waiting for a result
	}
}

int get_readout(int readRegister) {
	return read_register(readRegister) + (read_register(readRegister+1)<<8);
}

void set_gain(int gainRegister, int gain) {
	if (gain <4096) {
		uint8_t hi = gain >> 8;
		uint8_t lo = gain;

		set_register(gainRegister, lo);
		set_register(gainRegister+1, hi);
	}
}

void set_register(unsigned char r, unsigned char v){

	Wire.beginTransmission(I2C_ADDRESS);
	Wire.send(r);
	Wire.send(v);
	Wire.endTransmission();
}

unsigned char read_register(unsigned char r){

	unsigned char v;
	Wire.beginTransmission(I2C_ADDRESS);
	Wire.send(r); // register to read
	Wire.endTransmission();

	Wire.requestFrom(I2C_ADDRESS, 1); // read a byte
	while(!Wire.available()) {
		// waiting
	}
	v = Wire.receive();
	return v;
}

However, i'm stuck when it comes to sending the serial read to processing and writing the code used in processing in order to create a paintbrush that changes colour with the RGB values received by the colour sensor.

Any help would be greatly appreciated!

Alex

However, i'm stuck when it comes to sending the serial read to processing

What's the problem with the code that you have now for writing to the serial port?

I'd recommend that you move the color factor stuff to Processing, and send integer values to the serial port.

and writing the code used in processing in order to create a paintbrush that changes colour with the RGB values received by the colour sensor.

Is the problem with getting the data to Processing, or with using the data once it is in Processing?

Hi Paul,

the main problem i'm having is with using the data once it is in Processing, I need code which will allow these RGB values to influence the colour of a simple "click and drag" paintbrush.

Thanks for the reply

A

Everything you draw in Processing has a color associated with it. Create a small square, filled with the current color data read from the serial port. Update the color in the serialEvent callback.

Use the same color for everything else drawn.

Hi again,

As mentioned before, i'm very much a newbie with all this coding, really struggling to write the code. At the moment i have wrote this and running it in processing:

void setup() {
  size(1024, 768);
  background(#ffffff);
}

void draw() { 
  stroke(7, 146, 168);
  strokeWeight(4);

  if (mousePressed && pmouseX != 0 && mouseY != 0) {
    line(pmouseX, pmouseY, mouseX, mouseY);}
  }

what i need to know is what to write in terms of "current color data read from the serial port"?

Sorry for being so dumb about this

once again any help much appreciated

A

You have code on the Arduino to write red, green, and blue color data to the serial port. That information is available for Processing to read. Where is your code for reading data from the serial port?

I have changed the processing code a bit, but i'm not sure whether processing is picking up the serial read, as nothing comes out in the drawing sketch:

import processing.serial.*;
Serial myPort;


void setup() 
{
  myPort = new Serial(this, Serial.list()[0], 9600);
  size(1024, 768);
  background(#ffffff);
}

void draw(int r, int g, int b) { 
   if  (myPort.available() > 0)
  {  
    String inBuffer = myPort.readStringUntil('\n');
    if (inBuffer != null)
      {
         String[] tokens = split(inBuffer, ',');
         print(inBuffer);

          r = Integer.parseInt(tokens[0]);
          g = Integer.parseInt(tokens[1]);
          b = Integer.parseInt(tokens[2]);
         //  int clearVal = Integer.parseInt(tokens[3]) / 2;

      }
}
  
  stroke(r, g, b);
  strokeWeight(4);

  // Draw if mouse is pressed
  if (mousePressed && pmouseX != 0 && mouseY != 0) {
    line(pmouseX, pmouseY, mouseX, mouseY);}
  }

Hi
I have just come across your post and I am also having trouble getting color sensor data across to Processing.
Did you manage to resolve your problem?

I am also having trouble getting color sensor data across to Processing.

What trouble? With what Arduino code? With what Processing code?

I have a problem trying to communicate with my Processing sketch. Can somebody help me pls?

This is Arduino codes connected to my color sensor ADJD-S311 (I referred from: http://bildr.org/2012/01/adjd-s311_arduino/ )

#include <ADJDS311.h>
#include <Wire.h>

int sensorLed_pin = 2; //LED on the ADJDS-311
ADJDS311 colorSensor(sensorLed_pin);


void setup(){
 Serial.begin(9600);
 
 colorSensor.init();
 colorSensor.ledOn(); //turn LED on
 //Calibrate white 
 //Need to hold white card in front (1-3mm) of it to calibrate from
 colorSensor.calibrate(); 
}

void loop(){
 RGBC color = colorSensor.read(); //read the color
 
 Serial.print(color.red);
 Serial.print(" | ");
 Serial.print(color.green);
 Serial.print(" | ");
 Serial.print(color.blue);
 Serial.print(" | ");
 Serial.println(color.clear);
 

 
 delay(200); //just here to slow down the serial output
 
}

and this is the processing codes:

import processing.serial.*;
 
 float redValue = 0;        // red value
 float greenValue = 0;      // green value
 float blueValue = 0;       // blue value
float clearValue = 0;       // clear value
 
 Serial myPort;
 
 void setup() {
 size(200, 200);
 
 // List all the available serial ports
 println(Serial.list());
 // I know that the first port in the serial list on my mac
 // is always my  Arduino, so I open Serial.list()[0].
 // Open whatever port is the one you're using.
 myPort = new Serial(this, Serial.list()[0], 9600);
 // don't generate a serialEvent() unless you get a newline character:
 myPort.bufferUntil('\n');
 }
 
 void draw() {
 // set the background color with the color values:
 background(redValue, greenValue, blueValue);
 }
 
 void serialEvent(Serial myPort) { 
 // get the ASCII string:
 String inString = myPort.readStringUntil('\n');
 
 if (inString != null) {
 // trim off any whitespace:
 inString = trim(inString);
 // split the string on the commas and convert the 
 // resulting substrings into an integer array:
 float[] colors = float(split(inString, ","));
 // if the array has at least three elements, you know
 // you got the whole thing.  Put the numbers in the
 // color variables:
 if (colors.length >=4) {
 // map them to the range 0-255:
 redValue = map(colors[0], 0, 1023, 0, 255);
 greenValue = map(colors[1], 0, 1023, 0, 255);
 blueValue = map(colors[2], 0, 1023, 0, 255);
 clearValue = map (colors[3], 0, 1023, 0, 255);
 }
 }
 }

However, my processing window would be just black.
and this is how my arduino serial monitor looks like:

 Serial.print(color.red);
 Serial.print(" | ");
 Serial.print(color.green);
 Serial.print(" | ");
 Serial.print(color.blue);
 Serial.print(" | ");
 Serial.println(color.clear);

So, according to the serial monitor output, this should produce a record like:
298 | 1023 | 478 | 194

 String inString = myPort.readStringUntil('\n');

So, you read the whole record into inString.

 inString = trim(inString);

Then, you strip of any leading or trailing spaces, tabs, carriage returns and/or line feeds.

All fine. Then, you get stupid:

float[] colors = float(split(inString, ","));

You are asking Processing to convert that string containing integer values separated by | to an array of floats, identifying each token by the comma.

There are no commas in the string, and the tokens are not floats.

Try again.

OHH!!! This fixed my problem.

float[] colors = float(split(inString, ","));

and now I get it. Thanks!

Sorry, I have one more question, Paul S.

How do I get the previous serial value to subtract with the next one from the row?
So if let's say the difference is <100, I can call for an action.

is it something like:
for (int i=0; i< numValue ; i+100){
...
}

I have vague idea how to continue.

Screen Shot 2012-03-18 at 11.28.26 PM.png

How do I get the previous serial value to subtract with the next one from the row?
So if let's say the difference is <100, I can call for an action.

Processing has no idea of rows or anything like that. Some serial data came in. That data gets parsed and stored in some variables. Before storing new data in the variables, you could make a copy of the data that was there. Then, you could measure the difference between the new value and the old value, but it isn't done with a for loop.

Dears,

I am trying same code in processing as above and stuck. PaulS or beansprout or anyone else, can you help with correct syntax for following line of code to effectively run code and get output?

float[] colors = float(split(inString, ","));

beansprout:
OHH!!! This fixed my problem.

float[] colors = float(split(inString, ","));

and now I get it. Thanks!

an you help with correct syntax for following line of code

The following line of code is syntactically correct. If the values in colors are not what you expect, inString does not contain what Processing expects.

Why are you converting a string full of integer values to an array of floats?

Following is code for processing that worked for me. Thanks.

import processing.serial.*;
 
 float redValue = 0;        // red value
 float greenValue = 0;      // green value
 float blueValue = 0;       // blue value
float clearValue = 0;       // clear value
 
 Serial myPort;
 
 void setup() {
 size(200, 200);
 
 // List all the available serial ports
 //println(Serial.list());

 // I know that the first port in the serial list on my mac
 // is always my  Arduino, so I open Serial.list()[0].
 // Open whatever port is the one you're using.
 String portName = Serial.list()[0];
  myPort = new Serial(this, "COM30", 9600);
 // don't generate a serialEvent() unless you get a newline character:
 myPort.bufferUntil('\n');
 }
 
 void draw() {
 // set the background color with the color values:
 background(redValue, greenValue, blueValue);
   println(redValue);
 }
 
 void serialEvent(Serial myPort) { 
 // get the ASCII string:
 String inString = myPort.readStringUntil('\n');
 
 if (inString != null) {
 // trim off any whitespace:
 inString = trim(inString);
 // split the string on the commas and convert the 
 // resulting substrings into an integer array:
// Wrong float[] colors = float(split(inString, ","));

//float[] 
float[] colors = float(split(inString, "|"));

 // if the array has at least three elements, you know
 // you got the whole thing.  Put the numbers in the
 // color variables:
 if (colors.length >=4) {
 // map them to the range 0-255:
 redValue = map(colors[0], 0, 1023, 0, 255);

 greenValue = map(colors[1], 0, 1023, 0, 255);
 blueValue = map(colors[2], 0, 1023, 0, 255);
 clearValue = map (colors[3], 0, 1023, 0, 255);
 }
 }
 }

I am trying to use a color sensor I2C 16-BIT Color Level Sensor RGBC to send RGB values from Arduino to Processing in order to create a gradient effect using 5 different colors that Arduino would pick up. I am able to create the gradient manually if I input color values so I know that part works, the problem is sending data.

I am able to output 15 different RBG values (for 5 colors) on my serial monitor on Arduino. I am using Processing to have it read in the string of RGB values as an array from Arduino, in order to use those RGB values to show the color that the color sensor picked up.

I am not 100% sure if Arduino can read in these RBG values as an array, but 15 values are showing up so I think its my Processing code. When I run my processing code, a black background shows up and the servo motor that picks up color values runs again. I thought that I would have to run my Arduino code first and then run processing. I am confused as to why running processing would turn on my servo motor again. If anyone can help then please let me know!

I am new to this so I added my codes below.

Arduino:

#include <Servo.h>
#include <Wire.h> //Libraries for I2C

byte rec = 0x00;
int green,red,blue,cle;
int gh,gl;
int rh,rl;
int bh,bl;
int ch,cl;
double X,Y,Z,x,y,z;

Servo myservo; // create servo object to control a servo

int pos = 0;    // variable to store the servo position

void setup() {

   Wire.begin(); //join i2c bus (address optional for master)
   Serial.begin(9600);//start serial communication at 9600bps
  
    myservo.attach(12); // attaches the servo on pin 12 to the servo object

    myservo.write(pos);
  
}

void loop() { 

  for (pos = 0; pos <= 180; pos +=45) { // goes from 0 degrees to 180 degrees
    myservo.write(pos); // tell servo to go to position in variable 'pos'
    delay(100);
    
    Wire.beginTransmission(0x39); //Start I2C Address for Color sensor
    Wire.write(0x80);
    Wire.write(0x03); // Enable ADC
    Wire.endTransmission();//Stop transmitting
    delay(2000);//Delay 100 ms.
      Red();//Function Red Value
      Green();//Function Green Value
      Blue();//Function Blue Value
      Clear();//Function Clear Value
          //Serial.write("Red: ");
          Serial.println(red, DEC);// Show Red Value to Serial monitor
          //Serial.write("Green: ");
          Serial.println(green, DEC);// Show Green Value to Serial monitor
          //Serial.write("Blue: ");
          Serial.println(blue, DEC); // Show Blue Value to Serial monitor
          //Serial.print('\n');
     delay(100);
        }  // waits 15ms for the servo to reach the position
    
  for (pos = 180; pos >= 0; pos -= 1) { // goes from 180 degrees to 0 degrees
    myservo.write(pos);              // tell servo to go to position in variable 'pos'
    delay(15);                       // waits 15ms for the servo to reach the position
  }

myservo.detach();

    while(1) {
    //do nothing in here to stop color sensor 
  }

}
/********************************************************************************/
/*****************Function Green Value******************************************/
//code to read color values from company website http://www.gravitech.us/i2c16coleser.html
void Green() 
{
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.write(0x90); //Address Green lower Data for Using Read Byte Protocol
  Wire.endTransmission();//Stop transmitting
  
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.requestFrom(0x39, 1);//Request Green lower Data for color sensor
  gl = Wire.read(); //receive a byte as character
  Wire.endTransmission();//Stop transmitting
  
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.write(0x91);//Address Green upper Data for Using Read Byte Protocol
  Wire.endTransmission();//Stop transmitting
  
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.requestFrom(0x39, 1);//Request Green upper Data for color sensor
  gh = Wire.read();//receive a byte as character
  Wire.endTransmission();//Stop transmitting
  green = (256*gh)+gl;//Result returned in character
}
/*****************Function Red Value******************************************/
void Red()
{
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.write(0x92);//Address Red lower Data for Using Read Byte Protocol
  Wire.endTransmission();//Stop transmitting
  
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.requestFrom(0x39, 1);//Request Red lower Data for color sensor
  rl = Wire.read();//receive a byte as character
  Wire.endTransmission();//Stop transmitting
  
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.write(0x93);//Address Red upper Data for Using Read Byte Protocol
  Wire.endTransmission();//Stop transmitting
  
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.requestFrom(0x39, 1);//Request Red upper Data for color sensor
  rh = Wire.read();//receive a byte as character
  Wire.endTransmission();//Stop transmitting
  red = (256*rh)+rl;//Result returned in character
}
/*****************Function Blue Value******************************************/
void Blue()
{
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.write(0x94);//Address Blue lower Data for Using Read Byte Protocol
  Wire.endTransmission();//Stop transmitting
  
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.requestFrom(0x39, 1);//Request Blue lower Data for color sensor
  bl = Wire.read();//receive a byte as character
  Wire.endTransmission();//Stop transmitting
  
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.write(0x95);//Address Blue upper Data for Using Read Byte Protocol
  Wire.endTransmission();//Stop transmitting
  
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.requestFrom(0x39, 1);//Request Blue upper Data for color sensor
  bh = Wire.read();//receive a byte as character
  Wire.endTransmission();//Stop transmitting
  blue = (256*bh)+bl;//Result returned in character
}
/*****************Function Clear Value******************************************/
void Clear()
{
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.write(0x96);//Address Clear lower Data for Using Read Byte Protocol
  Wire.endTransmission();//Stop transmitting
  
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.requestFrom(0x39, 1);//Request Clear lower Data for color sensor
  cl = Wire.read();//receive a byte as character
  Wire.endTransmission();//Stop transmitting
  
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.write(0x97);//Address Clear upper Data for Using Read Byte Protocol
  Wire.endTransmission();//Stop transmitting
  
  Wire.beginTransmission(0x39);//Start I2C Address for Color sensor
  Wire.requestFrom(0x39, 1);//Request Clear upper Data for color sensor
  ch = Wire.read();//receive a byte as character
  Wire.endTransmission();//Stop transmitting
  cle = (256*ch)+cl;//Result returned in character
}
/**************************END**********************************/

Processing:

import processing.serial.*; // add the serial library
Serial myPort; // the serial port to monitor

//int a1, a2, a3, b1, b2, b3, c1, c2, c3, d1, d2, d3, e1, e2, e3;

int Y=1;
color a, b, c, d, e; 


void setup() {
size(800, 400); // set the window size, size() also sets width and height variables

printArray(Serial.list()); // list all available serial ports
myPort = new Serial(this, Serial.list()[1], 9600); // define input port
myPort.clear(); // clear the port of any initial junk

//noLoop();
}

void draw () {

 if (myPort.available () > 0) { // make sure port is open
 String inString = myPort.readStringUntil('\n'); 

if (inString != null) { // ignore null strings
inString = trim(inString); // trim off any whitespace
String[] array = splitTokens(inString, "\t"); // extract values into an array
// proceed only if correct # of values extracted from the string:



if (array.length >= 15) {
  int a1 = int(array[0]);
  int a2 = int(array[1]);
  int a3 = int(array[2]); 
  int b1 = int(array[3]);
  int b2 = int(array[4]);
  int b3 = int(array[5]);
  int c1 = int(array[6]);
  int c2 = int(array[7]);
  int c3 = int(array[8]);
  int d1 = int(array[9]);
  int d2 = int(array[10]);
  int d3 = int(array[11]);
  int e1 = int(array[12]);
  int e2 = int(array[13]);
  int e3 = int(array[14]);

  print(a1);
  print(a2);
  print(a3);  
  print(b1);
  print(b2);
  print(b3);
  print(c1);
  print(c2);
  print(c3);
  print(d1);
  print(d2);
  print(d3);
  print(e1);
  print(e2);
  print(e3);

  
a=color(a1,a2,a3);
b=color(b1,b2,b3);
c=color(c1,c2,c3);
d=color(d1,d2,d3);
e=color(e1,e2,e3);


ombre(0, 0, 800, 100 , a, b, Y); //rectange 1
ombre(0, 100, 800, 100 , b, c, Y); //rectange 2
ombre(0, 200, 800, 100 , c, d, Y); //rectange 3
ombre(0, 300, 800, 100 , d, e, Y); //rectange 4


}

}
}
}

void ombre(int x, int y, float w, float  h, color c1, color c2, int axis) { //function to create ombre

  noFill();
  
  if(axis == Y) { //creates gradient for colors in respective rectanges on y axis
    for( int i = y; i <= y+h; i++) { //colors stay in the rectange borders
    float range = map(i,y,y+h,0,1); //map(value, start1, stop1, start2, stop2) creates range for colors 
    color c = lerpColor(c1, c2, range); //calculates colors in between two colors
    stroke(c); //sets color to draw lines
    line(x,i,x+w,i); // first x point, first y point, second x point, second y point
    }
  
}
}