flask opencv demo

Tutorial ini merupakan kelanjutan dari "Pycharm Project Face Detection di Halaman Web Menggunakan OpenCV dan Flask". Dengan menginstall package Pyserial dari Pycharm, saya akan menampilkan hasil pembacaan sensor temperatur infra red MLX90614 pada layar webcam di web browser.

MLX90614 adalah Sensor Suhu Digital Inframerah Tanpa Kontak (IR) yang dapat digunakan untuk mengukur suhu objek tertentu mulai dari -70° C hingga 382,2°C. Sensor menggunakan sinar IR untuk mengukur suhu objek tanpa kontak fisik dan berkomunikasi dengan mikrokontroler menggunakan protokol I2C.

Fitur utama MLX90614 adalah sensor suhu IR tanpa kontak dengan akurasi tinggi. Sehingga dapat digunakan di industri untuk mengukur suhu benda yang bergerak seperti poros motor yang berputar. Karena akurasi dan presisinya yang tinggi, ini juga digunakan dalam berbagai aplikasi komersial, perawatan kesehatan, dan rumah tangga seperti pemantauan suhu ruangan, pengukuran suhu tubuh, dll.

Seperti disebutkan sebelumnya, sensor MLX90614 dapat mengukur suhu suatu objek tanpa kontak fisik dengannya. Hal ini dimungkinkan dengan hukum yang disebut Hukum Stefan-Boltzmann, yang menyatakan bahwa semua benda dan makhluk hidup memancarkan Energi IR dan intensitas energi IR yang dipancarkan ini akan berbanding lurus dengan suhu benda atau makhluk hidup tersebut. Jadi sensor MLX90614 menghitung suhu suatu benda dengan mengukur jumlah energi IR yang dipancarkan darinya.

I. Test Serial Print Arduino MLX90614

Hardware serta software yang diperlukan antara lain:

  • Hardware

    1. Microcontroller Arduino Uno

    arduino uno

    2. Sensor Temperatur MLX90614

    mlx90614

    3. Kabel Power Arduino Uno

    kabel power arduino

    4. Kabel Jumper Male to Male

    kabel jumper

    5. Breadboard

    breadboard
  • Wiring Diagram

    Rangkai komponen elektrikal di atas seperti wiring diagram berikut:

    setting
    MLX90614 Arduino
    VIN 3.3V
    GND GND
    SCL SCL
    SDA SDA
  • Install Adafruit MLX90614 Library

    Buka Library Manager pada Arduino IDE melalui menu Tools Manage Libraries...

    Ketikkan MLX90616 pada text box search, kemudian pilih Adafruit MLX90614 Library. Di sini saya menggunakan version 1.1.0. Kemudian klik Install.

    mlx90614 library
  • Upload Sketch

    Buka New Sketch pada Arduino IDE kemudian copy paste sketch .ino di bawah ini.

    #include <Wire.h>
    #include <Adafruit_MLX90614.h>
    Adafruit_MLX90614 mlx = Adafruit_MLX90614();
    
    
    void setup() {
      Serial.begin(9600);
      mlx.begin(); 
    }
    
    void loop() {
      Serial.println(mlx.readObjectTempC());
      
      delay(50);
    }
    
                                

    Klik Upload dan tunggu sampai done uploading.

    mlx90614 library

    Klik Serial Monitor untuk menampilkan nilai pembacaan sensor temperatur MLX90614.

    mlx90614 serial monitor

II. Update Pycharm Project FlaskOpenCV_FaceDetection

Seperti yang sudah saya sebutkan di awal paragraf bahwa tutorial ini merupakan kelanjuan dari project Pycharm Face Detection maka saya akan menggunakan seluruh file pada project FlaskOpenCV_FaceDetection untuk project Serial Print Arduino Sensor Temperatur MLX90614 ini. Jadi bagi teman-teman yang ingin mempraktikkan tutorial ini, diwajibkan untuk mengikuti langkah-langkah pembuatan project FlaskOpenCV_FaceDetection terlebih dahulu.

Update yang dilakukan antara lain menginstal package tambahan yaitu package pyserial dan update python file app.py. Sedangkan file index.html tidak perlu diupdate.

  • Install Package Pyserial

    Klik menu File Settings... pada Pycharm untuk menambahkan/menginstall package Pyserial. Setelah jendela Settings tampil, pilih menu Python Interpreter, kemudian klik tombol Plus pada halaman menu untuk menampilkan jendela Available Packages.

    menu setting

    Pada jendela Available Packages ketik "pyserial" pada text box pencarian. Pilih package pyserial kemudian klik tombol Install Package.

    pyserial package

    Tunggu sampai package selesai terinstal.

    pyserial package
  • Update python file app.py

    Update code file app.py tidaklah serumit seperti yang dibayangkan. Hanya menambahkan 6 baris kode saja, yaitu pada baris 3, baris 11 dan baris 23 sampai dengan 26.

    update app.py

    Perhatikan baris 11! Pada langkah I. Test Serial Print Arduino MLX90614, Arduino Uno dan PC berkomunikasi melalui port COM4. Sedangkan baudrate=9600 disesuaikan dengan syntax Serial.begin(9600) pada void Setup() di sketch arduino.

    Baris 23 sampai 26 merupakan teknis pengambilan dan penampilan data dari Serial.print() Arduino Uno yang merupakan nilai dari sensor temperatur MLX90614.

    Berikut code lengkapnya:

    from flask import Flask, render_template, Response
    import cv2
    import serial
    
    face_cascade = cv2.CascadeClassifier("C:/Users/Erik/PycharmProjects/FlaskOpenCV_FaceDetection/resources/haarcascade_frontalface_default.xml")
    
    app = Flask(__name__)
    
    def faceDetection():  # generate frame by frame from camera
        cap = cv2.VideoCapture(0)  # use 0 for web camera
        ser = serial.Serial('COM4', baudrate=9600, timeout=1)
    
        while True:
            success, img = cap.read()
    
            gray = cv2.cvtColor(img, cv2.COLOR_BGR2GRAY)
    
            faces = face_cascade.detectMultiScale(gray, 1.1, 4)
    
            for (x, y, w, h) in faces:
                cv2.rectangle(img, (x, y), (x + w, y + h), (255, 0, 0), 2)
    
                arduinoData = ser.readline().strip()
                tempvalue = arduinoData.decode('ascii')
    
                cv2.putText(img, tempvalue + ' C', (x + w - 70, y - 10), cv2.FONT_HERSHEY_SIMPLEX, 0.8, (153, 255, 255), 2, cv2.LINE_AA)
    
            frame = cv2.imencode('.jpg', img)[1].tobytes()
            yield (b'--frame\r\n'b'Content-Type: image/jpeg\r\n\r\n' + frame + b'\r\n')
    
            key = cv2.waitKey(1)
            if key == 27:
                break
    
    
    @app.route('/video_feed')
    def video_feed():
        # Video streaming route. Put this in the src attribute of an img tag
        return Response(faceDetection(), mimetype='multipart/x-mixed-replace; boundary=frame')
    
    
    @app.route('/')
    def index():
        """Video streaming home page."""
        return render_template('index.html')
    
    
    if __name__ == '__main__':
        # app.run(debug=True)
        app.run(host='127.0.0.1', port=5000, debug=True)
    
                                

III. Running Program

Setelah selesai mengikuti langkah-langkah di atas, kini saatnya menjalankan modifikasi aplikasi face detection ini. Klik kanan pada file app.py kemudian pilih Debug App (boleh juga pilih Run App).

debug app

Tunggu beberapa saat sampai tampil jendela Console di bagian bawah jendela Pycharm.

debug app

Klik URL yang tampil di jendela Console : http://127.0.0.1:5000

Jika tidak ada error maka Face Detection dan nilai sensor suhu MLX90614 akan tampil di tampilan webcam melalui web browser.

run app in browser
run app in browser

Video Demo dan Instruksi