[아두이노#433] (#5타이젠) chart.js로 센서값을 그래프로 표현&알람(notification)만들어보기!(녹칸다/포로리야공대가자)
(#5타이젠) chart.js로 센서값을 그래프로 표현&알람(notification)만들어보기!(녹칸다/포로리야공대가자)
녹칸다의 타이젠(TIZEN) OS를 이용한 사물인터넷(IoT)시리즈이다!
상용화된 웨어러블 제품중에 가장 ESP8266보드와 접목시키기 좋은 갤럭시워치를 대상으로 해서 예제를 만들어보도록 한다!
(이번 시리즈의 제약 사항)
1.녹칸다는 실물 기기를 보유하고 있지않아서 에뮬레이터로 예제를 구현하되 갤럭시워치3를 타겟으로 한다!(타이젠5.5)
2.최신 갤럭시워치가 타이젠OS를 지원하지 않는것에 대한 이슈는 관심대상이 아니다!
3.ESP8266보드를 웹소켓 서버로 구동하고 워치를 웹소켓 클라이언트로 해서 연결한다!
4.이때 ESP8266보드와 워치는 동일한 WiFi공유기에 연결되어있다고 가정한다!(집안에서만 사용한다는 느낌)
5.집밖에서 갤럭시워치를 이용해서 집안에 있는 ESP8266을 제어한다는 개념이라면 ESP8266에 외부에서 접속할 수 있는 네트워크를 제공해야한다!(이건 논외로 한다)
이번편에서는 ESP8266보드에 광센서와 온습도센서(DHT-11)를 연결하고 워치와 웹소켓통신으로 센서데이터를 넘긴다음 chart.js를 이용해서 그래프로 출력해보는 예제를 구현해보도록 하자!
그리고 센서값이 비정상적이라고 판단되면 ESP8266에서 워치쪽으로 경고알람(notification)을 발생시킬 수 있도록하고 어떻게 하면 실제로 활용할 수 있을지 고민해보도록 하자!
(실제로한거)
1.타이젠 스튜디오에서 chart.js를 이용해서 그래프를 그리는 기본 예제를 구현하시오!
2.ESP8266보드에 광센서(CDS)를 연결하고 1초한번 데이터를 수신해서 꺾은선그래프를 출력하시오!
3.그래프에 값을 7개 표현할 수 있다면 ESP8266에서 7개의 데이터를 한방에 전송해서 시각화할 수 있도록 하시오!
4.온습도센서(DHT-11)을 연결해서 온도와 습도값으로 실시간 그래프를 출력하시오!(3번예제와 유사하게~)
5.TAU에 멀티페이지를 이용해서 1페이지에는 습도그래프만 출력하고 2페이지에는 온도그래프만 출력하시오!
6.워치에 버튼을 하나 만들고 버튼을 누르면 푸시알람을 발생시키시오!
7.푸시알람이 발생했을때 가장 최근에 1건만 유지하고 있으면 지우고 있으면 지우고 이렇게 만드시오!
8.ESP8266의 시리얼모니터에 유저가 뭔가 입력하면 그값을 워치에 push notification으로 알람을 발생시키시오!
9.ESP8266에 광센서를 1개 연결하고 광센서의 값이 특정한 값을 넘어서게 되면 워치쪽으로 푸시알람을 발생시키시오!
(tizen studio 다운로드)
https://developer.tizen.org/development/tizen-studio/download
(tizen push notification)
https://docs.tizen.org/application/web/api/5.5/device_api/mobile/tizen/notification.html
(chart.js)
https://github.com/chartjs/Chart.js/releases/tag/v3.7.1
(버튼CSS)
https://www.w3schools.com/css/css3_buttons.asp
ESP8266관련라이브러리(websocket)
https://github.com/Links2004/arduinoWebSockets