Chart.js

Home > Chart.js

ソーラー発電&Arduino測定の気象データをChart.jsでグラフ化⑥高速化

HomeMadeGarbage Advent Calendar 2022 |4日目 2021年のアドベントカレンダーで行っていた気象データのグラフ化ですが、約1年以上の運用となりグラフの表示が重くなって来たため、高速化を行いました。 https://homemadegarbage.com...

Advent Calendar / Web 2022.12.4 お母ちゃん アバター画像

ソーラー発電&Arduino測定の気象データをChart.jsでグラフ化⑤表示調整

前回 https://homemadegarbage.com/weather-graph4/ 今回はちょこちょことお父ちゃんから依頼のあった表示の調整を行いました。 ソースコード <!doctype html> <html lang="en"> <head&...

Web 2022.1.8 お母ちゃん アバター画像

ソーラー発電&Arduino測定の気象データをChart.jsでグラフ化④日付形式

前回は日付範囲指定が出来るように調整しました。 https://homemadegarbage.com/weather-graph3 ただこれだと、ログデータは10分毎のデータとなっているため、 日付を狭めた時に同じ日付が並んでラベルに表示されてしまい、 見づらくなってしまいました。 なの...

Web 2022.1.7 お母ちゃん アバター画像

Chart.jsで折れ線グラフのラインが表示されない

Chart.jsの折れ線グラフで、なぜかラインが表示されず困りましたが、 spanGaps: true を追加することで表示されるようになりました。 myChart = new Chart(ctx, { type: 'line', data: {...

Web 2022.1.5 お母ちゃん アバター画像

ソーラー発電&Arduino測定の気象データをChart.jsでグラフ化③日付範囲指定

HomeMadeGarbage Advent Calendar 2021 |21日目 前回 https://homemadegarbage.com/weather-graph2 ソースコード <!doctype html> <html lang="en"> <...

Advent Calendar 2021.12.21 お母ちゃん アバター画像

ソーラー発電&Arduino測定の気象データをChart.jsでグラフ化②グラフ切替

HomeMadeGarbage Advent Calendar 2021 |12日目 前回 前回は、Arduino で取得している気象データphpで取得し、 Chart.js で気温をグラフ表示するところまでやってみました。 https://homemadegarbage.com/weath...

Advent Calendar / Web / 電子工作 2021.12.12 お母ちゃん アバター画像

ソーラー発電&Arduino測定の気象データをChart.jsでグラフ化①

HomeMadeGarbage Advent Calendar 2021 |6日目 ソーラー発電&Arduino で気象データの測定 ベランダで測定している気象データをいつでも見やすいようグラフ化する事にしました。 https://homemadegarbage.com/mkr-1010-01...

Advent Calendar / 電子工作 2021.12.6 お母ちゃん アバター画像