arduinoからの処理でグラフを作成する方法

Question

arduinoに接続された光電池の値を処理グラフに出力するだけの簡単な操作をしようとしています。私は浮動小数点数として処理コンソールに値を出力することができました。スケッチウィンドウはポップアップしますが、グラフはありません。何か簡単なものだと確信していますが、わかりません。私がプロットしているもののスケール（printlnは私に0.2から1.1の間の値を与えます）しかし、私はグラフのスケーリングに失われてしまい、出力がないと思います。ここに私の処理コードは次のとおりです。

import processing.serial.*; 

Serial myPort;  // The serial port 
int xPos = 1;   // horizontal position of the graph 

//Variables to draw a continuous line. 
int lastxPos=1; 
int lastheight=0; 

void setup() { 
    // set the window size: 
    size(600, 400);   

    // List all the available serial ports 
    // Check the listed serial ports in your machine 
    // and use the correct index number in Serial.list()[]. 

    myPort = new Serial(this, "/dev/tty.usbmodem1421", 9600); // 

    // A serialEvent() is generated when a newline character is received : 
    myPort.bufferUntil('\n'); 
    background(0);  // set inital background: 
} 
void draw() { 
    // everything happens in the serialEvent() 
} 

void serialEvent (Serial myPort) { 
    // get the ASCII string: 
    String inString = myPort.readStringUntil('\n'); 
    inString = trim(inString); // trim off whitespaces. 
    //println(inString); 
    if (inString != null) { 

    float inByte = float(inString);   // convert to a number. 
    inByte = map(inByte, 0, 1023, 0, height); //map to the screen height. 
println(inByte); 
    //Drawing a line from Last inByte to the new one. 
    stroke(127,34,255);  //stroke color 
    strokeWeight(4);  //stroke wider 
    line(lastxPos, lastheight, xPos, height - inByte); 
    lastxPos= xPos; 
    lastheight= int(height-inByte); 

    // at the edge of the window, go back to the beginning: 
    if (xPos >= width) { 
     xPos = 0; 
     lastxPos= 0; 
     background(0); //Clear the screen. 
    } 
    else { 
     // increment the horizontal position: 
     xPos++; 
    } 
    } 
} 

Answer 1

私は紫色の線を描画することができたそれらの部分を除去することで、arduinoの入力を持っていませんが。しかし、それは単純にウィンドウの一番下に描かれていました。なぜなら、inStringの静的な値の"0.5"を使用して、入力値と同じオーダーの大きさにとどまっていたからです。すなわち、フロートに変換する場合：

float inByte = float(inString)*500;、

がさらにアップラインを描い単に値を乗算します。フロートの入力にheight、さらには1023を掛けてみるとよいでしょう。私が使用した0.5の値にheightを掛けても、線を中央よりも底に近く引きます（つまりheight/2）。

以下はキャンバスに紫色の線を描画するために使用したコードの完全な例です。あなたが見ることができるように、私は単にdraw()にすべてを移動し、取り外しシリアル入力パーツ：

int xPos = 1;   // horizontal position of the graph 

//Variables to draw a continuous line. 
int lastxPos=1; 
int lastheight=0; 

void setup() { 
    // set the window size: 
    size(600, 400);   

    // List all the available serial ports 
    // Check the listed serial ports in your machine 
    // and use the correct index number in Serial.list()[]. 
    background(0);  // set inital background: 
} 
void draw() { 
    // get the ASCII string: 
    String inString = "0.5"; 
    inString = trim(inString); // trim off whitespaces. 
    //println(inString); 
    if (inString != null) { 
    float inByte = float(inString)*1023;   // convert to a number. 
    inByte = map(inByte, 0, 1023, 0, height); //map to the screen height. 
    println(inByte); 
    //Drawing a line from Last inByte to the new one. 
    stroke(127,34,255);  //stroke color 
    strokeWeight(4);  //stroke wider 
    line(lastxPos, lastheight, xPos, height - inByte); 
    lastxPos= xPos; 
    lastheight= int(height-inByte); 

    // at the edge of the window, go back to the beginning: 
    if (xPos >= width) { 
     xPos = 0; 
     lastxPos= 0; 
     background(0); //Clear the screen. 
    } 
    else { 
     // increment the horizontal position: 
     xPos++; 
    } 
    } 
}