How to change the properties of class with sensor data from Arduino

I’m so new to processing and I need help with my code.
Basically i have a sensor connected to Arduino that sends out data of an array of data. I’m able to send the data to processing and gets them converted to int successfully.
My plan is to use these sensor data ( an array [36]), to change the color of a 2D grid array ([6][6]).
I saw a perfect example of using 2D array from this link.

My pan is to see how i can map the sensor values to the 2D array grid since they are of the same size (36). So that according to the change of values of the sensor data, the corresponding grid will change color.

Now i do not know how to use the sensor values to change the properties of the class object.

attached is my code.

// 2D Array of objects
Cell[][] grid;
import processing.serial.*; 
Serial myPort;  // Create object from Serial class
//String myString = null; // initialize the string to which the message will be assigned
int end = 10;    // the number 10 is ASCII for linefeed (end of serial.println), later we will look for this to break up individual messages

// Number of columns and rows in the grid
int cols = 6;
int rows = 6;

int[] serialInArray = new int[36]; // Where we'll put what we receive
int count = 36;

void setup() {
   myPort = new Serial(this, "COM7", 9600);
  grid = new Cell[cols][rows];
  for (int i = 0; i < cols; i++) {
    for (int j = 0; j < rows; j++) {
      // Initialize each object
      grid[i][j] = new Cell(i*100,j*100,100,100,i+j);

void draw() 
   // The counter variables i and j are also the column and row numbers and 
  // are used as arguments to the constructor for each object in the grid.  
  for (int i = 0; i < cols; i++) 
    for (int j = 0; j < rows; j++) 
      // Oscillate and display each object

 // read the serial buffer for the sensor data
void serialEvent(Serial myPort) {
  String myString = myPort.readStringUntil(end);
  // if we get any bytes other than the linefeed:
  if (myString != null) 
    // remove the linefeed
    myString = trim(myString);
    // split the string at the tabs and convert the sections into integers:
    int mysensors[] = int(split(myString, '\t'));
    count = mysensors.length;
   for (int k=0; k<count; k++)
  serialInArray[k] = mysensors[k];
println (serialInArray[k]);

class code
// A Cell object
class Cell {
  // A cell object knows about its location in the grid 
  // as well as its size with the variables x,y,w,h
  float x,y;   // x,y location
  float w,h;   // width and height
  float angle; // angle for oscillating brightness
int[] serialInArray = new int[36]; // Where we'll put what we receive
  // Cell Constructor
  Cell(float tempX, float tempY, float tempW, float tempH, float tempAngle) {
    x = tempX;
    y = tempY;
    w = tempW;
    h = tempH;
    angle = tempAngle;
  // Oscillation means increase angle
  void oscillate() {
    angle += 0.02; 

  void display() {
    // Color calculated using sine wave
1 Like

Your Cell class has an array in it for all 36 ints of data!
This is probably not what you want.
Each Cell does not need it’s own copy of all of the data.
Each Cell really only cares about only ONE of the ints!

Consider the following code:

class Cell{
  float x, y, c;
  Cell(float ix, float iy){
    x = ix;
    y = iy;
    c = 0;
  void draw(){
    text("" + int(c), x+10, y+30);

Cell[] cells = new Cell[36];

void setup(){
  for( int i = 0; i < cells.length; i++){
    cells[i] = new Cell( (i%6)*60, (i/6)*60 );

void draw(){  
  for (int i = 0; i < cells.length; i++){

void mousePressed(){

void read_data(){
  for (int i = 0; i < cells.length; i++){
    cells[i].c = random(map(i,0,36,0,255));
1 Like

Thank you for your prompt response, much appreciated.
Because i’m still new to processing and your code is not commented, some things are not very clear to me, please permit me to ask the following questions.

At what point in the code will the data from the sensor be able to control the color of the 6*6 array grid?

Because what i want is an array of 6 column and 6 rows which will have a total of 36 cells. And also because the data from my sensor is also an array having 36 values, i want to know at what point and how will the values from the sensor be mapped to the corresponding array grid. Basically i just want to be able to control the color change of the array grids with the sensor values.

Sorry if maybe my question is as a result of lack of proper understanding of code.

Thank you

1 Like

Since I don’t have a sensor to generate data, I wrote a read_data() function that randomly generates some data for me.

You, however, will be reading the data in your serialEvent() function, which happens occasionally when there is data to read.
You should set the values in your Cells inside that function too, using the data you got.

1 Like

Thank you for your help.
I have been able to map the sensor readings to the array and the color changing according to the sensor values.
My next step is to create a ball, then the ball position will be changing according to the sensor value that is the highest at a time.
I will appreciate if you have some idea that will be helpful.
Thank you