マトリョーシカ的日常

ワクワクばらまく明日のブログ。

M5StackとAmbientでIoTをはじめる！

m5stack

https://www.instagram.com/p/BvKZnefnGJu/

M5Stack + Ambient = らくらくIoT

　M5StackをつかってIoTをやってみることにした。調べたらAmbientというサービスを使えばよさそうなことがわかった。AmbientはIoTデータの可視化サービスである。アカウントを登録しチャンネルをもらえば、センサデータをグラフで確認できる。

Ambientの登録方法

Ambient – IoTデーター可視化サービス

　上記のサイトでユーザー登録を行う。終了したらチャンネルを作成する。チャンネルにつけられたリードキーとライトキーをつかってセンサデータのやり取りをおこなう。詳しいマニュアルはこちらにある。
　
Ambientを使ってみる – Ambient

Ambientライブラリのインポート

　次にライブラリをインポートする。下記リンクの「Clone or download」をクリックし、ZIPファイルをダウンロードする。
GitHub - AmbientDataInc/Ambient_ESP8266_lib: IoTデーター可視化サービス「Ambient」のESP8266/ESP32用ライブラリーと、温度・湿度センサー、心拍モニター、消費電流モニターなどのサンプルプログラムです。

　次にArduino IDEを立ち上げ、「スケッチ」>「ライブラリをインクルード」>「.ZIP形式のライブラリをインストール」　を選択。ダウンロードしたZIPファイルを選択する。これで完了。
　
　↓ここに詳しいやり方が書いてある。
Arduino ESP8266で温度・湿度を測定し、Ambientに送ってグラフ化する – Ambient

コード

　とりあえずセンサーなどは使わずに、Wi-Fiの通信がうまくいくかだけを確かめることにした。こんなかんじ。

#include <M5Stack.h>
#include <Wire.h>
#include "Ambient.h"

#define PERIOD 60

WiFiClient client;
Ambient ambient;

const char* ssid     = "******"; /*ここを書き換える*/
const char* password = "******"; /*ここを書き換える*/

unsigned int channelId = *****; // AmbientのチャネルID
const char* writeKey = "*****"; // ライトキー
int number = 1;
unsigned long t;
void setup(){
    M5.begin();
    Wire.begin(); // I2Cの初期化
    Serial.begin(74880);
    delay(100);
    M5.Lcd.println("\r\nM5Stack+BME280->Ambient test");

    WiFi.begin(ssid, password);  //  Wi-Fi APに接続
    while (WiFi.status() != WL_CONNECTED) {  //  Wi-Fi AP接続待ち
        delay(100);
    }

    M5.Lcd.print("WiFi connected\r\nIP address: ");
    Serial.println(WiFi.localIP());

    ambient.begin(channelId, writeKey, &client); // チャネルIDとライトキーを指定してAmbientの初期化
}

void loop() {
    number = (number+1) % 10;
        ambient.set(1, number);
        ambient.send();
        M5.Lcd.println(number);
    delay(6000);
}
  • ssid と password はWi-Fiのルータなどに書いてある。いつも使用しているやつを使う。

　コードを書き込みしてディスプレイに数字が表示されるようになったら自分のチャンネルページを確認して欲しい。リアルタイムでグラフが更新されるはずだ。

おわりに

　どんどんIoT環境が整ってきた！次はモータを使ってなにかを動かしたい！動くものがあるとメカっぽくなるよね。


M5Stack用プロトキット（温湿度センサ付き）

M5Stack用プロトキット（温湿度センサ付き）

M5stackでプッチ神父回路をつくった。ひたすら素数を数えるよ。

m5stack


#M5stack プッチ神父回路をつくった。素数を数えるよ。

　以前、Arduinoでつくっていたプッチ神父回路をM5stackに移植した。ボタンを押すとひたすら素数を数え続けるすぐれものである。Arduinoでは7segLEDやボタンをつけないといけなかったが、M5stackはそんなことは必要ない。非常に簡単につくれる。

コード
#include <M5Stack.h>
// The setup() function runs once each time the micro-controller starts
  int sosu = 1;
  int j = 2;
void setup() {
  // init lcd, serial, not init sd card
  M5.begin(true, false, true);
  M5.Lcd.clear(BLACK);
  M5.Lcd.setTextColor(YELLOW);
  M5.Lcd.setTextSize(2);
  M5.Lcd.setCursor(65, 10);

  M5.Lcd.println("CALM DOWN...");
  delay(3000);
  M5.Lcd.println("COUNT PRIME NUMBERS TO KEEP YOUR COMPOSURE");
  delay(3000);
  M5.Lcd.println("PRIME NUMBERS ARE SOLITARY NUMBERS");
  delay(3000);
  M5.Lcd.println("THAT CAN ONLY BE DIVIDED BY I AND ITSELF...");
  delay(3000);
  M5.Lcd.println("THEY GIME ME STRENGTH...");
  delay(1000);
  
  
  M5.Lcd.setCursor(3, 185);
  M5.Lcd.println("-ENRICO PUCCI-");
  M5.Lcd.println("Press button B 700ms clear");
}
//-RGBcolor-from https://qiita.com/nnn_anoken/items/ea6b5e81623ba690343c-
uint16_t getColor(uint8_t red, uint8_t green, uint8_t blue){
  return ((red>>3)<<11) | ((green>>2)<<5) | (blue>>3);
}
void getSosu(){
  sosu=sosu+1;
  while(sosu!=j){
    while(sosu % j !=0){
      j=j+1;
    }
    if(sosu==j){
      j=2;
      break;
    }
    sosu=sosu+1;
    j=2;
  }
}
// Add the main program code into the continuous loop() function
void loop() {
  M5.Lcd.setTextSize(20);
  M5.Lcd.setTextColor(getColor(200,255,100));
  M5.update();

  // if want use Releasefor; suggest use Release in press event
  if (M5.BtnA.wasReleased()) {
  M5.Lcd.clear(0x0000);
  M5.Lcd.setCursor(0, 0);
  getSosu();
  M5.Lcd.print(sosu);
  } else if (M5.BtnB.wasReleased()) {
  } else if (M5.BtnC.wasReleased()) {
  } else if (M5.BtnB.wasReleasefor(700)) {
    M5.Lcd.clear(0x0000);
    j=2;
    sosu=1;
    M5.Lcd.setCursor(0, 0);
  }
}
色のRGB指定

　twitterでRGB指定できるよと教えてもらった。参考サイトは↓
https://qiita.com/nnn_anoken/items/ea6b5e81623ba690343c

uint16_t getColor(uint8_t red, uint8_t green, uint8_t blue){
  return ((red>>3)<<11) | ((green>>2)<<5) | (blue>>3);
}

こんな関数をつくり、あとで色の指定の時にgetColor(R,G,B);とすればOK。R,G,Bはそれぞれ0~255まで。

昔の記事

tsukutta.hatenablog.com

エンリコプッチとは

　ジョジョの第六部に出てくる悪役。素数を数えて落ちつく。

超像可動 「ジョジョの奇妙な冒険」第6部 77.エンリコ・プッチ(荒木飛呂彦指定カラー)約16cm PVC製 塗装済み可動フィギュア

超像可動 「ジョジョの奇妙な冒険」第6部 77.エンリコ・プッチ(荒木飛呂彦指定カラー)約16cm PVC製 塗装済み可動フィギュア

M5Stackでお絵かきソフトをつくってみる。

m5stack


#m5stack drawing soft!!!!

たのしい

　M5stackははじめからディスプレイがついているので、簡単にお絵かきができる。三角とか四角、丸がかけるよ！

コード
#include <M5Stack.h>
// The setup() function runs once each time the micro-controller starts
void setup() {
  // init lcd, serial, not init sd card
  M5.begin(true, false, true);
  M5.Lcd.clear(BLACK);
  M5.Lcd.setTextColor(YELLOW);
  M5.Lcd.setTextSize(2);
  M5.Lcd.setCursor(65, 10);
  M5.Lcd.println("OEKAKI SOFT");
  M5.Lcd.setCursor(3, 35);
  M5.Lcd.println("Press button B 700ms clear");
  M5.Lcd.setTextColor(RED);
}
// Add the main program code into the continuous loop() function
void loop() {
  M5.update();
 
  // if want use Releasefor; suggest use Release in press event
  if (M5.BtnA.wasReleased()) {
    M5.Lcd.drawRect(random(M5.Lcd.width()-1), random(M5.Lcd.height()-1), random(M5.Lcd.width()-1), random(M5.Lcd.height()-1), BLUE);
  } else if (M5.BtnB.wasReleased()) {
    M5.Lcd.drawTriangle(random(M5.Lcd.width()-1), random(M5.Lcd.height()-1), random(M5.Lcd.width()-1), random(M5.Lcd.height()-1), random(M5.Lcd.width()-1), random(M5.Lcd.height()-1), YELLOW);
  } else if (M5.BtnC.wasReleased()) {
    M5.Lcd.drawCircle(random(M5.Lcd.width()-1), random(M5.Lcd.height()-1),random(3)*10, RED);
  } else if (M5.BtnB.wasReleasefor(700)) {
    M5.Lcd.clear(0x0000);
    M5.Lcd.setCursor(0, 0);
  }
}

　

コマンド
  • M5.Lcd.drawCircle 円を描く
  • M5.Lcd.drawTriangle 三角形を描く
  • M5.Lcd.drawRect 四角形を描く
  • random　乱数をつくる


　あとは色を調整すればそれっぽくなりそう。

M5Stack用ウォッチバンド（黒）

M5Stack用ウォッチバンド（黒）

文字の大きさや色を変えてみる/M5Stack

m5stack

https://www.instagram.com/p/BuRv4nFnma4/

　M5Stackをまだまだ適当にいじる。文字の大きさや色をいいかんじに変えられることがわかった。

コード

/*
    Name:       button.ino
    Created:	  2018/9/21 14:06:15
    Author:     sakabin
*/

#include <M5Stack.h>

// The setup() function runs once each time the micro-controller starts
void setup() {
  // init lcd, serial, not init sd card
  M5.begin(true, false, true);
  M5.Lcd.clear(BLACK);
  M5.Lcd.setTextColor(YELLOW);
  M5.Lcd.setTextSize(2);
  M5.Lcd.setCursor(65, 10);
  M5.Lcd.println("CHANGE Size and Color");
  M5.Lcd.setCursor(3, 35);
  M5.Lcd.println("Press button B 700ms clear");
  M5.Lcd.setTextColor(RED);
}
// Add the main program code into the continuous loop() function
void loop() {
  M5.update();
 
  // if want use Releasefor; suggest use Release in press event
  if (M5.BtnA.wasReleased()) {
    M5.Lcd.setTextSize(1.8);
    M5.Lcd.setTextColor(YELLOW);
    M5.Lcd.print(" YELLOW");
  } else if (M5.BtnB.wasReleased()) {
    M5.Lcd.setTextSize(2);
    M5.Lcd.setTextColor(WHITE);
    M5.Lcd.print(" WHITE ");
  } else if (M5.BtnC.wasReleased()) {
    M5.Lcd.setTextSize(2.8);
    M5.Lcd.setTextColor(ORANGE);
    M5.Lcd.print(" ORANGE ");
  } else if (M5.BtnB.wasReleasefor(700)) {
    M5.Lcd.clear(0x0000);
    M5.Lcd.setCursor(0, 0);
  }
}

新しい命令

  1. M5.Lcd.setTextSize()

　文字のサイズを変更できる。1はすごくちいさい。2がちょうどいい。3はでかすぎる。

  1. M5.Lcd.setTextColor();

　文字の色を変更できる。いろんな色が指定できる。

M5Stack/ILI9341_Defines.h at master · m5stack/M5Stack · GitHub

　いろのいろいろ。

感謝


　ツイッターで質問したらこたえてもらった。感謝感激。

つぎはお絵かきソフトをつくるぞ！！

　図形を描くぞ！

M5Stack Gray（9軸IMU搭載）

M5Stack Gray（9軸IMU搭載）