Home画面の環境値の表示部分が消える

[dlpMSR]

以下のエラーが出ている模様 TypeError: e.temperature.toFixed is not a function

Websockerで値が降ってくるとエラーでコンポーネントが落ちるようだ

dockerの開発環境でも発生するが、こちらは表示部のコンポーネントが落ちたりしない （最初に取得した値を表示し続ける）

[dlpMSR]

原因

wsで降ってくるJSONをオブジェクトに変換した後の各値(気温、湿度、CO2)の型がstringになっていた。 その値を toFixed(1) で整形しようとしてエラーとなっていた。

対応

JSONをオブジェクトにした後、各値を parseFloat() でFloatに変換するようにした。 wsで降る各値が必ず小数に変換できる文字列であることを保証する必要があるのが気になった

[dlpMSR]

補足

chart画面の方はstringのまま、特にtoFixed()等の加工はせずに表示しているっぽい

[dlpMSR]

APIの返すJSONの中で3値は全て数値になっているが、WSで得られるJSONでは気温と湿度は文字列で、CO2は数値になっている(?)

あるべき姿としては、まず

1. APIとWSが同じ形のJSONを返してほしい。
2. 数値は少数第一位までの数値として返す。この時少数第一位が0でも表示する。

[dlpMSR]

correction_value = {
    'temperature': "%0.1f" % scd4x.temperature,
    'humidity': "%0.1f" % scd4x.relative_humidity,
    'co2': round(statistics.mean(co2_thirty_mins), 1),
    'timestamp': datetime.datetime.now(timezone('UTC')).strftime("%Y-%m-%d %H:%M:%S")
}

ここで

"%0.1f" % scd4x.temperature

こういう指定だと文字列になる。数値のまま扱いたければco2と同様にround()で丸めるのがよいと考えられる。

ちなみにAPIだと文字列が混ざらないのはdjangoのserializerを通しているから。

[dlpMSR]

試しに、実際にcorrection_valueを作る際にroundで丸めるとwsで降ってくる値は次のようになる

{temperature: 7.5, humidity: 80, co2: 976.7}

.0が消えてしまう。JSONの数値に.0を残すにはどうすればいいのか 🤔うーんわからんから一旦これでいいか。parseする時にIntになったりFloatになったりしないかだけ不安か

[dlpMSR]

表示部について。 javascriptのtoFixed()はNumber型のメソッドなので、多分文字列でなければ大丈夫っぽい。

[dlpMSR]

最終的な仕様

1. API これまで通り。timestampが文字列でそれ以外は数値。

   {
   "timestamp": "2023-05-10 08:12:25",
   "temperature": 23.6,
   "humidity": 48.5,
   "co2": 827.0
   }

2. WS 今まではなぜかtemperatureとhumidityが文字列だったけど、数値にする。各値の小数第一位が0の時は0埋めされるとは限らない。

   {temperature: 43.1, humidity: 4.2, co2: 919.9}