ProcessingでM5StackのPoseをモデルに反映する

引き続いて、M5Stackのpitch/roll/yaw情報をUDPで送って、Processing上のモデルに反映してみます。

M5Stackからはpitch/roll/yaw情報をカンマ区切りのテキストで送ります。

このテキストをProcessingで受信して、直方体のモデルのposeに反映します。正負が逆になったx/z軸は値を反転。座標系の取り方でどうにでもなるような気もしますが。

Processingのソースは見ての通り単純です。最初3Dの描画できなくて調べたらベータ版では動かないようで4.1.1にアップデートしたらきちんと動作しました。

codeは、

https://github.com/chateight/processing/blob/main/sketch_221220b.pde

/*
read m5stack udp data(IMU data ; pitch, roll, yaw) and move the imaginary object

*/
import hypermedia.net.*;

UDP udp;
final String IP = "0.0.0.0";

PFont myFont;

float[] pry = new float[3];      // pitch, roll, yaw store work


void setup() {
  
  udp = new UDP(this, 3002);
  udp.listen( true );

  size(500,500,P3D);
  frameRate(30);
  loop();
}

void draw() {
  background(0);
 
  translate(width/2, height/2);
  rotateX(radians(-pry[1]));
  rotateY(radians(pry[0]));
  rotateZ(radians(-pry[2]));
  box(150, 150, 50);
}

void receive( byte[] data, String ip, int port ) {
  String message = new String( data );
  println( "received : \""+message+"\" from "+ip+" on port "+port );
  
  String[][] matchedTexts = matchAll(message, "[0-9|-]+.[0-9]+");

  if (matchedTexts != null) {
    int index = 0;
    for (String[] matchedText : matchedTexts){
      pry[index] = float(matchedText[0]);
      index++;
    }
  }
  println(pry[0], pry[1], pry[2]);    // pitch, roll, yaw
  
}

動かして見たのは、今のYouTube画面で参照ください。yawは時間経過とともにずれていくのでいくらか補正はしていますが、十分じゃ無いですね。

 

admin