Anda di sini

5 posts / 0 new
Posting terakhir
#1

Menampilkan nilai sensor pada grafik di web


Mohon maaf sebelumnya karena saya masih awam dan baru mempelajari sedikit tentang arduino. Bagaimana cara menampilkan nilai x, y, & z dari accelerometer (MPU6050) kedalam grafik pada web?

Web Interfacing Sensor MPU6050


Halo , Saya coba bantu jawab ya, Untuk dapat menampilkan data sensor / interfacing melalui antarmuka web ada banyak cara / metode yang bisa digunakan. Namun urutan secara umumnya, biasanya menggunakan tiga lapisan. Lapisan pertama adalah lapisan pengumpan / feeder. Feeder ini merupakan program yang ada di Arduino/Mikrokontroler yang melakukan pembacaan data sensor, data yang telah didapatkan oleh feeder ini selanjutnya dikirim ke lapisan kedua melalui berbagai metode komunikasi. Umumnya metode yang digunakan adalah komunikasi serial. Lapisan kedua ini adalah gateway. Gateway sendiri merupakan sebuah program di komputer yang melakukan pembacaan data yang dikirim oleh feeder tadi. Jadi gateway ini akan menangkap data yang dikirim melalui serial oleh feeder, dan meneruskannya ke lapisan ketiga. Media yang digunakan oleh gateway untuk meneruskan data ke lapisan ketiga umumnya dapat menggunakan tiga protokol yaitu HTTP, AJAX dan yang terbaru WebSocket. Gateway sendiri umumnya diprogram menggunakan bahasa Python atau Node JS. Lapisan ketiga ini sendiri merupakan program / aplikasi webnya. Biasanya ditulis menggunakan JavaScript. Aplikasi javascript ini akan menerima data sensor dari gateway melalui tiga pilihan protokol tadi yaitu HTTP, AJAX atau WebSocket. Berkat hadirnya teknologi HTML 5, kini kebanyakan orang menggunakan websocket sebagai media komunikasinya. Karena dengan menggunakan websocket komunikasinya dapat dilakukan dua arah, berlatency rendah, dan hemat sumber daya. Nah... itu sedikit ilmu dasar dari teknik interfacing data sensor dengan antarmuka web. Selanjutnya kembali ke pertanyaan, Bagaimana cara menampilkan nilai x, y, & z dari accelerometer (MPU6050) kedalam grafik pada web? Maka dari itu langkah-langkahnya secara umum adalah: 1. Program Arduino agar dapat membaca data sensor MPU6050 X, Y dan Z, dan cetak hasilnya ke serial menggunakan Serial.print dengan format yang mudah untuk di-parsing, misal
...
Serial.print(x);
Serial.print(";");
Serial.print(y);
Serial.print(";");
Serial.println(z);
...
Sehingga hasilnya diserial menjadi x;y;z atau 10;15;20 2. Buat gatewaynya menggunakan Python atau Node JS. Karena teknologi sekarang sudah banyak beralih ke websocket, dan websocket terbukti sangat handal, maka saya sarankan menggunakan websocket sebagai media komunikasinya. Terdapat banyak sekali library / modul untuk websocket server di Python / Node JS. SIlahkan gunakan salah satu. Lakukan pembacaan serial melalui bahasa tersebut dan parsing data sensornya, 10;15;20 itu sehingga dapat disimpan ke variabel x = 10; y = 15 dan z = 20. Disini juga ada yang membuat . 3. Buat halaman web dengan HTML/CSS, dan gunakan library untuk membuat grafik di web. Ada banyak library untuk ini, salah satunya adalah Chartjs. Selanjutnya tinggal program websocket client di javascript dan update data Chartjs sehingga grafiknya bergerak sesuai dengan data dari sensor. Itu adalah kunci inti dari teknik membuat antarmuka web sensor, tutorial detilnya akan saya coba tulis disini apabila ada waktu luang dan ada yang meminjamkan saya MCU6050, hehehe... semoga membantu
(Reply to #2)

Web interfacing sensor MPU6050


Terimakasih banyak untuk info sekaligus arahannya, ini sangat membantu saya dalam belajar, saya akan mencoba sesuai arahan diatas. Namun saya mohon bantuan tutor detailnya jika ada waktu luang untuk lebih mengarahkan lagi.
(Reply to #3)

Membuat gateway


Kasus serupa saya alami Mohon tutorial detailnya, saya gagal pada bagian membuat gateway menggunakan node js
(Reply to #4)

Tutorial Web Interfacing Sensor (Node Js)


Wah, saya berminat untuk mencoba nulis tutorial web interfacing dengan Node Js... dari dulu pengen nyoba Node, semoga minggu ini kekejar dan punya satu tulisan tentang web interfacing dengan NodeJs


HTSL://HIGH THINKING SIMPLE LIVING . ME