# Is possible use different layer for the axes on chart?

**URL:** <https://discourse.processing.org/t/is-possible-use-different-layer-for-the-axes-on-chart/11150>\
**Category:** Electronics (Arduino, etc.)\
**Created:** [May 12, 2019, 5:44am UTC](https://discourse.processing.org/t/is-possible-use-different-layer-for-the-axes-on-chart/11150 "2019-05-12T05:44:58Z")\
**Posts on this page:** 1\
**Showing post:** 2

<div class="post-metadata">

**Author:** ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)\
**Post date:** [May 12, 2019, 5:57am UTC](https://discourse.processing.org/t/is-possible-use-different-layer-for-the-axes-on-chart/11150/2 "2019-05-12T05:57:39Z")

</div>

you could start with  
[Issue with using array after splitTokens()](https://discourse.processing.org/t/issue-with-using-array-after-splittokens/10826/4) this  
or mod version

```auto
// v01 get CSV line // like: 1023,927,843,761,693,0,0 A0,1,2,3,4 D2,3
// v02 save to table

Table table;
String outfile = "data/arduino.csv";
/*
A0,A1,A2,A3,A4,D2,D3
1023,927,839,751,672,0,0
*/

import processing.serial.*;
Serial port;

String ports, inString;
String[] elements;
boolean diagp = true;//false;//true;
int baud = 115200; // 300, 600, 1200, 2400, 4800, 9600, 14400, 19200, 28800, 38400, 57600, 115200, 230400, 250000, 500000, 1000000, 2000000
boolean getrecord= false;
int many = 0, expect = 7, recs=0;
int[] values = new int[expect];
float zoom;

void setup() {
  size(300, 300);
  if ( diagp ) printArray(Serial.list());
  ports = Serial.list()[1];
  port = new Serial(this, ports, baud);
  port.bufferUntil('\n');
  stroke(0);
  zoom = (height-60)/1023.0;
  background(200, 200, 0);
  println("use \nkey [p] for diagnostic print\nkey [c] clear\nkey [s] save table");
  setup_table();
}

void draw() {
  if ( getrecord ) {
    getdata();
    stroke(200, 200, 0);
    line(recs, 0, recs, height); // the actual line is init with the background color first ( overwriting old graph ) 
    for (int i=0; i<expect; i++ ) { 
      float ypos = height-50 - values[i]*zoom;
      if ( i > 4 ) ypos = height-10*(i-4) - 5*values[i]; // for the digital vals
      if ( diagp ) println(" values ["+i+"] "+values[i]+" xpos "+recs+" ypos "+ypos);
      stroke(0, i*40, 200-i*40);
      point( recs, ypos ); // graph
    }
    recs++; // next pix xdir
    if ( recs > width ) recs = 0;
    stroke(255);
    line(recs, 0, recs, height); // and draw a white line ahead to show "cursor"
    stroke(200, 0, 0); // grid on cursor! analog
    for (int k=0; k<6; k++ ) line(recs, 10 + k*( height-60)/5, recs+3, 10 + k*( height-60)/5);
    stroke(0, 0, 200); // grid on cursor! digital
    for (int k=0; k<=3; k++ ) line(recs, height -10 - k*5, recs+5, height -10 - k*5);

    getrecord = false;
  }
}

void getdata() {
  if ( diagp ) println(inString);
  elements = splitTokens(inString, ","); // split and set some globals...
  int many = elements.length;
  if ( many >= expect ) {
    for (int i=0; i<expect; i++ ) { // convert the string to int only for the expected value list
      if ( diagp ) print(elements[i]+" , ");
      values[i] = int(elements[i]);
    }
    if ( diagp ) println();
    store_record();
  } else {
    println("com error, found short line:"+inString);
  }
}

void serialEvent(Serial thisport) { // read the serial buffer:
  inString = thisport.readString();
  if ( inString != null ) {
    inString = trim(inString); // clean
    getrecord = true;
  }
}

void keyPressed() {
  if ( key == 'p' ) println("diagp: "+(diagp = ! diagp));
  if ( key == 'c' ) background(200, 200, 0);
  if ( key == 's' ) { 
    saveTable(table, outfile);
    println("save to: "+outfile);
  }
}

void setup_table() {
  table = new Table();
  table.addColumn("A0");
  table.addColumn("A1");
  table.addColumn("A2");
  table.addColumn("A3");
  table.addColumn("A4");
  table.addColumn("D2");
  table.addColumn("D3");
}

void store_record() {
  TableRow newRow = table.addRow();
  for ( int c =0; c<7; c++) newRow.setInt(c, values[c]);
}

/*
// arduino code tested Arduino Leonardo Arduino IDE 1.8.9 hourly 
 
 String aline; // readable char line
 
 void make_aline() {
 aline = "";
 aline += analogRead(0);
 aline += ',';
 aline += analogRead(1);
 aline += ',';
 aline += analogRead(2);
 aline += ',';
 aline += analogRead(3);
 aline += ',';
 aline += analogRead(4);
 aline += ',';
 aline += digitalRead(2);
 aline += ',';
 aline += digitalRead(3);
 // ++ CR LF
 }
 
 int wait = 500;
 long baud = 115200; // 300, 600, 1200, 2400, 4800, 9600, 14400, 19200, 28800, 38400, 57600, 115200, 230400, 250000, 500000, 1000000, 2000000
 
 void setup() {
 Serial.begin(baud);
 while (!Serial) {
 ; // wait for serial port to connect. Needed for native USB port only ( arduino leonardo )
 }
 }
 
 void loop() {
 make_aline();
 Serial.println(aline);
 delay(wait);
 }
 
 */

```

and make it more nice?

 ![SNAG-0113](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/b/ba078a768b04e2713e16d0e5bd6a5c43af860b88.jpeg)

---

_[View the full topic](https://discourse.processing.org/t/is-possible-use-different-layer-for-the-axes-on-chart/11150)._