照明ネットワーク

照明のネットワークに関する記事を書きます。照明の通信を行うのに使えるツールなども作成していく予定です。

【実験部屋】Art-Netの出力をM5Stackでモニターする【Wi-Fi】【M5Stack】


f:id:aisakakun:20200202222948p:plain

目的

Luminet Monitorを使用しArt-NetのDMXパケット「ArtDMX」をWi-Fiで送信し、Wi-Fiで指定のユニバースをM5Stackが受信し、受信したユニバースの中から特定の値を読み取り、M5Stack上に描画すること。

準備物

・Luminet Monitor(ArtDMX出力ツールとして使用)
Luminet Monitor | ルミネックス
・M5Stack Basic development kit

PC側

ArtDmxを出力するためのソフトウェア「Luminet Monitor」を下記リンクよりダウンロードしてください。
(Art-DMXを出力するソフトであればなんでも良いです。)
Luminet Monitor | ルミネックス
f:id:aisakakun:20200202224252p:plain:w500
画面左下の「DMX Generator」の「Add generator」をクリックすると「DMX Generator」のなかに一つGenerator1が表示されます。今回はユニバース0:0:1を使用するので、「Start」列を「1」にしてください。
「Function」列をダブルクリックすると機能を変更することができます。
「Control」に変更し、「Control」と表示されている箇所を右クリックし「Control panel」をクリックするとフェーダの画面が表示されます。

f:id:aisakakun:20200202224732p:plain:w500
フェーダ画面
ch1 ~ ch9のフェーダを適当に調整し、調整が完了したらフェーダ画面を閉じて、「DMX Generator」の「State」列にチェックを入れてください。
これでPC側の準備は完了です。wireshark(通信ログ確認ソフト)を確認し、このように表示されていれば成功です。
f:id:aisakakun:20200202225200p:plain:w500
wiresharkの通信ログ

M5Stack側(ソースコード)

M5Stack側ですが、下記ソースコードSSID、passswordをご自身の環境の設定に変更してM5Stackに書き込んでください。

#include <ArtnetWifi.h>
#include <M5Stack.h>
#include <WiFi.h>

const char* ssid = "SSID"; //接続するアクセスポイントのSSIDに書き換える
const char* password = "password";//接続するアクセスポイントのパスワードに書き換える

//Art-Net setting
ArtnetWifi artnet;

//M5Stack Lcd setting
int pos_x = 40;
int pos_y = 140;
int height = 80;
int width = 80;

//Wi-Fiの接続確認
boolean ConnectWifi(void)
{
  boolean state = true;
  int i = 0; 
  WiFi.begin(ssid,password); //Wi-fi APに接続する
  while(WiFi.status() != WL_CONNECTED){ //Wi-Fi AP接続待ち
    delay(500);
    M5.Lcd.print(".");
    if(i > 20){
      state = false;  
      break;
    }
    i++;
  }
  if(state){
    M5.Lcd.print("\r\nWiFi connected\r\nIP address:");
    M5.Lcd.println(WiFi.localIP());
  }else{
    M5.Lcd.println("");
    M5.Lcd.println("Conection failed.");
  }
  return state;
}

//M5Stackに描画する際にRGB値を使用するため
uint16_t getColor(uint8_t red, uint8_t green, uint8_t blue){
  return ((red>>3)<<11) | ((green>>2)<<5) | (blue>>3);
}

void onDmxFrame(uint16_t universe, uint16_t length, uint8_t sequence, uint8_t* data)
{
  if(universe == 1){
    for(int i = 0; i < 3; i++){
      M5.Lcd.fillRect(pos_x + i*width, pos_y,height,width,getColor(data[0+i*3],data[1+i*3],data[2+i*3]));
    }
  }else{
    //受信なしで黒に
    M5.Lcd.fillRect(pos_x,pos_y,height,width*3,BLACK);
  }
}

void setup() {
  // put your setup code here, to run once:
  M5.begin();
  M5.Lcd.setTextSize(2);
  ConnectWifi();
  artnet.begin();

  // onDmxFrame will execute every time a packet is received by M5Stack.
  artnet.setArtDmxCallback(onDmxFrame);
}

void loop() {
  // put your main code here, to run repeatedly:
  artnet.read();
}

私が参照したサイトはこちらです。
参照サイト
qiita.com

結果

f:id:aisakakun:20200202225924j:plain
結果
ArtDMXのch1(Red)ch2(Green)、ch3(Blue)とし、ch4〜ch6、ch7〜ch9も同様に考えています。
それぞれの合成色はそれぞれの四角に色として現れます。

まとめ

ArtDMXの出力をモニタするプログラムについて紹介しました。Art-Netについて知るにはプログラムを通して実践的に学ぶと理解が進みやすいです。プログラミングに抵抗がない方は是非試してみてください。
M5Stackについては以下の本を参照しました。

みんなのM5Stack入門

みんなのM5Stack入門

使用したM5Stackはこちら。

関連記事

ArtDMXについては下記記事を参照ください。
※1:
show-network-lab.hateblo.jp