Grafik TFT:Grafik Riwayat Langsung

Bagian kode ini akan menggambar garis luar grafik, menggambar garis sumbu x dan y, juga menggambar tanda dan memberi label sumbu y dengan nilai.

• Baca Suhu

chk =DHT.read11(22); temp =(DHT.temperature); 

Baris kode pendek ini akan membaca suhu dari sensor DHT 11 dan kemudian akan menyimpannya dalam sebuah variabel.

• Gambar Grafik

if(blockPos <8) { // mencetak waktu tft.setCursor((mark[valuePos] - 5), (asal + 16)); tft.setTextColor(GraphColor, PUTIH); tft.setTextSize(1); tft.println(timeBlock[nilaiPos]); // memetakan nilai locationBlock[valuePos] =map(temp, 0, graphRange, originY, (originY - sizeY)); // menggambar titik tft.fillRect((mark[valuePos] - 1), (locationBlock[valuePos] - 1), markSize, markSize, pointColor); // coba sambungkan ke titik sebelumnya if(valuePos !=0) { tft.drawLine(mark[valuePos], locationBlock[valuePos], mark[(valuePos - 1)], locationBlock[(valuePos - 1)], lineColor); } blokPos++; } else { // bersihkan kanvas grafik tft.fillRect((originX + 2), (originY - sizeY), sizeX, sizeY, WHITE); // memetakan nilai - titik saat ini locationBlock[valuePos] =map(temp, 0, graphRange, originY, (originY - sizeY)); // draw point - titik saat ini tft.fillRect((mark[7]), (locationBlock[valuePos] - 1), markSize, markSize, pointColor); // menggambar semua poin untuk(int i =0; i <8; i++) { tft.fillRect((mark[(blockPos - (i + 1))] - 1), (locationBlock[(valuePos - i)] - 1), markSize, markSize, pointColor); } // gambar semua garis for(int i =0; i <7; i++) { tft.drawLine(mark[blockPos - (i + 1)], locationBlock[valuePos - i], mark[blockPos - (i + 2)], locationBlock[valuePos - (i + 1)], lineColor); } // ubah label waktu untuk(int i =0; i <=8; i++) { tft.setCursor((mark[(blockPos - i)] - 5), (asal + 16)); tft.setTextColor(GraphColor, PUTIH); tft.setTextSize(1); tft.println(timeBlock[nilaiPos - i]); } } nilaiPos++; 

Bagian kode yang panjang ini akan menggambar titik-titik grafik pada nilainya dan kemudian akan menggabungkannya melalui garis, kode memeriksa apakah kanvas grafik terisi, jika ya, itu akan mulai mengeluarkan nilai pertama grafik dan memindahkan yang lain ke atas untuk memberikan ruang bagi nilai baru yang akan dimasukkan, jika masih ada ruang yang tersisa, perangkat akan terus menambahkan nilai pada interval.

Mempersonalisasi Grafik

Hal yang menyenangkan dari grafik ini adalah 100% dapat diedit, sehingga pengguna dapat mengedit ukuran grafik, lokasi dan warnanya, pengguna juga dapat menampilkan data apa pun pada grafik berkat fleksibilitasnya. Adalah semua variabel yang harus Anda perhatikan.

bool proDebug =0; uint16_t graphColor =BIRU; uint16_t pointColor =HITAM; uint16_t lineColor =HIJAU; String graphName ="Grafik Waktu"; int rentang grafik =50; int markUkuran =3; 

• proDebug adalah utilitas debugging yang dibangun ke dalam proyek, itu diatur ke 0 sebagai default, ketika diatur ke 1/benar, itu akan mencetak suhu saat ini ke Serial Monitor, ini adalah utilitas debugging, perhatikan bahwa jika diaktifkan, Serial Monitor adalah harus terbuka agar kode dapat dijalankan.

• graphColor mengatur warna grafik, garis x dan y dan labelnya diatur ke warna ini.

• warna titik mewakili warna titik yang menggambarkan nilai pada grafik.

• lineColor menyetel warna garis yang menghubungkan titik-titik pada grafik ke warna yang dipilih.

• graphRange adalah tulang punggung grafik, perhatikan bahwa sangat penting bahwa itu diatur dengan benar, ini mewakili nilai maksimal yang dapat dibuat grafik, saya menggunakan sensor suhu, saya tidak akan mengharapkan nilainya melebihi 50ºC, jadi saya mengatur nilai ke 50, jika Anda ingin membuat grafik input analog mentah, Anda dapat mengatur graphRange ke 1024, nilai maksimal yang dapat ditampilkan oleh pin analog.

• markSize mewakili ukuran titik yang memberi label nilai sensor pada grafik, nilai mewakili panjang persegi.

Dan hanya itu, hanya itu yang perlu Anda khawatirkan, sisa variabel akan ditentukan secara otomatis oleh Arduino.

Berubah yang Nilai

Sangat bagus untuk membuat grafik suhu di kamar Anda, tetapi lebih baik lagi jika Anda dapat menampilkan data sensor apa pun pada grafik, dan Anda dapat, hanya dengan mengedit beberapa baris kode, Anda dapat membuat grafik data apa pun dari kelembaban tanah hingga cahaya intensitas. Berikut adalah panduan untuk melakukannya.

Pergi Selanjutnya

Anda dapat bereksperimen lebih jauh dengan proyek, coba edit konstanta originX, originY, sizeX dan sizeY untuk memberikan ukuran dan posisi berbeda pada grafik Anda di layar. Ada file header yang dilampirkan ke sketsa utama, berisi kode warna dari beberapa warna, coba ubah warna bagan dan batangnya. Dan itu dia, grafik hasil personalisasi Anda sudah siap.

Perpustakaan

• Perpustakaan Elegoo - Hak Cipta (c) 2012 Adafruit Industries di bawah Lisensi BSD.

• DHT - Penulis Rob Tillaart perpustakaan ini berada dalam domain publik

Latar belakang

Saya baru-baru ini menerbitkan sebuah proyek yang membuat grafik 1, 2, 3 atau 4 nilai pada diagram batang. Saya telah memutuskan untuk menerbitkan template lain untuk grafik. Tidak ada template untuk diagram batang yang tidak memiliki garis di semua tempat yang mengancam untuk membingungkan, jadi saya memutuskan untuk menghitung ulang dan menerbitkan proyek sederhana yang memungkinkan semua orang untuk membuat grafik data mereka pada grafik riwayat, secara langsung.

Skema

schematics_g5pey3GWqv.fzz