Arduino MQ-3 sensor sending signal input to p5.js

jstate1

I am making a breathlyzer for a project using Arduino uno and p5.js. When I blow into the arduino sensor, it should display random circles on computer screen in p5.js. I am having problems with signal communication from my Arduino to p5.js. The connection is working, but the random circles are not displaying on my screen. Here is my code.

project.ino

int level;
int LEDgreen2 = 2;
int LEDgreen3 = 3;
int LEDgreen4 = 4;
int LEDred7 = 7;
int LEDblue13 = 13;



void setup()
{ 
  Serial.begin(9600);
  pinMode(LEDgreen2, OUTPUT);
  pinMode(LEDgreen3, OUTPUT);
  pinMode(LEDgreen4, OUTPUT);
  pinMode(LEDred7, OUTPUT);
  pinMode(LEDblue13, OUTPUT);               
}

void loop()
{
    for(int time = 0;time <= 3000;time++) //blow for 3 seconds
    {      
      digitalWrite(LEDblue13, HIGH);                          
      level = analogRead(A0);
      delay(1);
    }

digitalWrite(LEDblue13, LOW); 

if ( level > 200) //no alch
{
  digitalWrite(LEDgreen2, HIGH); 
  digitalWrite(LEDgreen3, HIGH); 
  digitalWrite(LEDgreen4, HIGH);
}
else 
{
  digitalWrite(LEDred7, HIGH);
  Serial.println(level); 
}

delay(2000); //Wait 2 seconds to start over 
digitalWrite(LEDblue13,HIGH); //TURN ON BLUE LIGHT (START OVER)
digitalWrite(LEDgreen2, LOW); //turn off green LED
digitalWrite(LEDgreen3, LOW); //turn off green LED
digitalWrite(LEDgreen4, LOW); //turn off green LED
digitalWrite(LEDred7, LOW);//turn off red LED
}

p5.js

var serial;
var inByte = 0;



function setup() {
  createCanvas(windowWidth, windowHeight);
  serial = new p5.SerialPort();
  serial.on('data', serialEvent)
  serial.open("COM3");
}

function draw() {

}


function serialEvent() {
 var inString = serial.readStringUntil('\r\n'); 
 inString = inString.trim();

 if (inString.length > 0) {
   inByte = Number(inString);
   print(inByte);
 }
 if(inByte>200){
   var x = random(width);
   var y = random(height);

   var r = random(255);
   var g = random(255);
   var b = random(255);

   fill(r, g, b, 100);
   ellipse(x, y, 50, 50);
 }
}

kfrajer

The connection is working, but the random circles are not displaying on my screen.

How do you know the connection is working?

I suggest you try this next. i just provide code for draw and serial Event. Code is untested.

Kf

var holdTime=-1; //Init value

function draw() {

  if (millis() > holdTime) {
    background(0);
    inByte=0;   //Reset
  } else {
    var x = random(width);
    var y = random(height);

    var r = random(255);
    var g = random(255);
    var b = random(255);

    fill(r, g, b, 100);
    ellipse(x, y, 50, 50);
  }
}     

function serialEvent() {
  var inString = serial.readStringUntil('\r\n'); 
  inString = inString.trim();

  //Only process data if there was no data before (not in holding state)
  //holding state release in draw after three seconds (if there was an event)
  if (inString.length > 0 && inByte == 0) {
    inByte = Number(inString);
    print(inByte);
    if (inByte>200) {
      holdTime=millis() + 3000;  //Event detected: Hold state for 3 seconds
    }
  }
}