（18/100）Node-REDダッシュボード Part2 ／ Node-RED100本ノック

文字起こし

はい、みなさんこんにちは。

スマートライトの中畑です。

Node-RED100本ノック第18回目、やっていきたいと思います。

今回もですね、Node-REDダッシュボードの第2回目となります。

では、いってみましょう！

前回はNode-REDレッドダッシュボードをNode-REDにインストールして、で画面を見るという方法をご紹介いたしました<。/p>

パート1の方法をご覧になってない方は最初にパート1の方を是非ご覧ください。

では、今日はその続きになります。

で前回はこちらですね、はい、えーとインジェクトNodeでタイムスタンプが押されると、ここに表示されるというのをやりました。

じゃあここももう1回やってみましょう。

こういうふうに表示されますと。

じゃあ、次はですね。

ここにNode-REDダッシュボードで表示させるのにテキストガウジ、これ読み方ちょっとわからないんですけど、でチャートというのがあります、これをちょっと全て使ってみましょう

ゲイジかなガウジ、ゲイジはい。

で、これでまずはつなぎますとはい。

で、タイムスタンプじゃなくて、今度はここにナンバーにして1番、1っていうのをインジェクトNodeからこの3つのNodeに送ります。

で、テキストはそのままでいいですね。

今ラベルがテキストになっているので、ここで、じゃナンバーにしましょう。

ナンバー、ここゲージっていうのがあるので、タイプゲージ。

まあこれはこのままでいいですね、はい。

で、デフォルト、home、はい。

これは大丈夫そうですね、アップデート。

次チャート、チャートの方も、これもこのままでいいですね。

これで大丈夫かな、あ、いきましたね、はい。

じゃあ、これでデプロイしてみます。

で、この画面を表示させるのは、ダッシュボード、でダッシュボードのこういう画面が出るのでここですね、ここにリンク、はい。

これでこのNode-REDダッシュボード画面が出ます。

今まだインジェクトNodeを1回も押してないのでこういうふうにあの前回のね、タイムスタンプがで出てるんですけど、じゃあここでインジェクトNodeを一回押しますと。はい

で、これで見てみましょう。

はい、このゲージが、1が出ましたね

で、チャートの方は、なんかこんな感じですね、ナンバーが1になっています。

じゃあ、これ、もう1回1をしてみましょう。

えーと、ゲージの方は変わらず、チャートの方は時間があるんですけどここに、こうですね。

はい、10時45分03秒に1っていうデータが来て、でこのままちょっとマウスをずらしていくと、はい10時45分30秒にもう1回1っていうのが表示されて、ナンバーはこのままです。

じゃもう一回、今度は1じゃなくて、これを2にしてみましょう

で、押します、押しますというかつなげます。

デプロイ。

で今はそのままなんですけど、はい、じゃあ2を押しますと。

そうするとゲージの方が2になって、チャートの方は1から2になりました。

そしてナンバーは今押された番号になっています。

じゃあまた次。

今度はまた1を押してみましょう。

そうするとゲージは1になって、はいチャートの方はこういうふうに落ちましたね、1に。

で、ナンバーは1になっています。

というふうに、このテキストNode、ゲージNode、チャートNodeっていうのは、送られたデータをナンバーはそのまま表示して、ゲージの方はこういうグラフみたいな感じで表示させると。

チャートのほうは時系列で表示させると、いうような機能になっています

じゃあ、例えば今度はここに100とか入れてみましょうね。

100を入れると、で、まずは今こんな状況です。

で、この100を押すと。

そうするとゲージの方は100。

ただ、ここに10ってありますよね。

赤くなってこのマックスまで来てるんですけど10で、チャートの方は100だと、ナンバーの方はそのまま。

でゲージの方をもう1回ちょっと見てみると、ここにミニマムが0でマックスが10になってますよね。

なので、このえーと例えばこれが、じゃあもう1回、今度はゲージの方のmaxを1000にしました。

はいで押す。

デプロイ。

じゃもう一回これで、あー確認しましょうね。

100、100だと前回はmaxが10、ここが10で100を押してたので、これが真っ赤になってたんですけど、今はmaxが1000にしてあるので、ここ緑になってますね。

というようにこのゲージの量によって、ここの色を変えるということがこれできるんですよ。

なので、じゃあこれを500、500にしてこうですね。

まぁ、こんな感じで送られてきたデータをそのまま表示させることもできるし、まぁこういうふうにゲージでそれが全体の上限に近い値なのか、それとも下限に近い値なのか、それでも普通なものなのか、っていうのをできるし、チャートで時系列でその変化を表示させるということができます、はい。

と、いうふうにNode-REDダッシュボード、結構色々使い道があるんですよね。

なので、ここらへんは一つ一つやりながら自分で試してどんなふうに表示させるのかというのをやってみるといいと思います。

はい、で僕自身も結構Node-REDダッシュボード、あんまり使いこなしてないのでこの100本ノックでいろいろ試しながらやっていきたいと思います。

本日はここまでになります。

では、次回また会いましょう。

さようなら。