9. 値を変換してプロットしたい

9.1. 完了イメージ

値を変換してプロットできます。

../../_images/convValue_goal.png



9.2. 手順1

メニューバーをクリック

../../_images/convValue_01.png


9.3. 手順2

「Flow Editor」をクリック

../../_images/convValue_02.png


9.4. 手順3

「フロー2」タブをクリック

../../_images/convValue_03.png


9.5. 手順4

functionノードを新規作成

../../_images/convValue_04.png


9.6. 手順5

新規作成したfunctionノードをダブルクリック

../../_images/convValue_05.png


9.7. 手順6

コード欄の「return msg;」を削除

../../_images/convValue_06.png


9.8. 手順7

以下のJavaScriptコードをコピーし、コード欄にペースト

//表示データ選択時
if(msg.payload.length != 0) {
    msg.payload[0].series.forEach((seriesName, i) =>{
        //変換する系列の系列名は？
        if(seriesName == "系列名"){
            let tmp = msg.payload[0].data[i].map(elem => {
                let y = elem.y;
                //変換式を記述

                return {x:elem.x, y};
            });
            msg.payload[0].data[i] = tmp;
        }
    });
//表示データ未選択時
}else{
    //何もしない
}

return msg;

注釈

同じ変換をしたい系列が複数あるときは、下記のように、「|| series == "系列名"」を増やしていけば良いです。

//表示データ選択時
if(msg.payload.length != 0) {
    msg.payload[0].series.forEach((seriesName, i) =>{
        //変換する系列の系列名は？
        if (seriesName == "系列名1" || seriesName == "系列名2" || seriesName == "系列名3") {
            let tmp = msg.payload[0].data[i].map(elem => {
                let y = elem.y;
                //変換式を記述

                return {x:elem.x, y};
            });
            msg.payload[0].data[i] = tmp;
        }
    });
//表示データ未選択時
}else{
    //何もしない
}

return msg;

注釈

系列によって変換式が異なるときは、下記のように「if(seriesName == "系列名"){ ... }」のブロックを増やします。

//表示データ選択時
if(msg.payload.length != 0) {
    msg.payload[0].series.forEach((seriesName, i) =>{

        if(seriesName == "系列名1"){
            let tmp = msg.payload[0].data[i].map(elem => {
                let y = elem.y;)
                //系列名1のデータ変換式を記述

                return {x:elem.x, y};
            });
            msg.payload[0].data[i] = tmp;
        }

        if(seriesName == "系列名2"){
            let tmp = msg.payload[0].data[i].map(elem => {
                let y = elem.y;
                //系列名2のデータ変換式を記述

                return {x:elem.x, y};
            });
            msg.payload[0].data[i] = tmp;
        }

        if(seriesName == "系列名3"){
            let tmp = msg.payload[0].data[i].map(elem => {
                let y = elem.y;
                //系列名3のデータ変換式を記述

                return {x:elem.x, y};
            });
            msg.payload[0].data[i] = tmp;
        }
    });
//表示データ未選択時
}else{
    //何もしない
}

return msg;


9.9. 手順8

コード5行目の「系列名」に、変換したいデータのプルダウン項目名、または凡例名を入力
そして、コード14行目に変換式を記述する。
※ 下図は系列名「AccSensor/X.val」の値を1000倍している
../../_images/convValue_08.png

注釈

変換式の例

1000を足す

y = y + 1000;

1000を引く

y = y - 1000;

1000で割る

y = y / 1000;

2乗する

y = y ** 2;

平方根 \(\sqrt{(\mathrm{y})}\)

y = Math.sqrt(y);

指数 \(\mathrm{e}^{\mathrm{y}}\)

y = Math.exp(y);

常用対数 \(\log_{10} (\mathrm{y})\)

y = Math.log10(y);

自然対数 \(\ln(\mathrm{y})\)

y = Math.log(y);

三角関数

y = Math.sin(y);
y = Math.cos(y);
y = Math.tan(y);

組み合わせる

y = (y - 1)/1000;

その他の関数は こちら をご確認ください。



9.10. 手順9

「完了」をクリック

../../_images/convValue_09.png


9.11. 手順10

編集したfunctionノードを、下図の通りに配置

../../_images/convValue_10.png


9.12. 手順11

このままだと一番上のグラフだけ値が変換されるので、残りのchartノードの前にも追加

注釈

ノードを複製するには

  1. Ctrlキーを押しながら、Cキーを押してノードをコピーし

  2. Ctrlキーを押しながら、Vキーを押して貼り付け

します。

../../_images/convValue_11.png


9.13. 手順12

「デプロイ」をクリック

../../_images/convValue_12.png