본문 바로가기

Angular.js/프로젝트2

농장 온도변화 모니터 (plotly.js, RxJS) 설명:- 농장에 설치된 약 30개의 센서에서 감지하는 온도수치를 시각적으로 표현.- 5초 간격으로 서버에서 디바이스에 매핑된 약 30개의 온도에 대한 수치값을 가져와 최저/최고/평균 값을 동별로 보여준다.- Ploty를 활요해 농장을 3D 모델로 만들고, 실제 센서의 위치를 생성된 모델 안에 위치시킴으로써 최대한 현실과 비슷하게 만들어 사용자의 집중도를 높힘.- 왼쪽 위에 있는 항목들을 클릭하면 가운데 보이는 3D 농장의 레이어들이 토글되어 보이고 숨겨지고 한다. 특징: 1. blender로 3D 모델을 만든 뒤 gometry 를 뽑아냈다. (blener에서 geometry 뽑아내는 script 보기)2. 3D 모델(농장 inner/outer, 동/서/남/북, 센서위치)을 구성하는 geometry는 모두.. 2024. 5. 20.
Angular project, Plotly.js & WebGL is not supported issue 로컬에서는 Plotly가 잘 작동되었다. 그리고 배포이후에도 잘 작동되었는데, 1개월 후 정도 지난 뒤 서비스에서 "WebGL is not supported by your browser" 문구가 Plotly 차트가 있어야할 부분에 크게 써있었다.해당 문구를 클릭하면 내가 접속한 디바이스에서 WebGL이 구동될 수 있는 환경인지 확인해주는 페이지로 이동했고, 정상적으로 구동되는 것을 보여주었다. (3D 와이어프레임 상자가 회전하는 모습이 보이면 정상)  구체적인 이슈 상황을 정리하자면...1. 2D type의 그래프는 정상적으로 나오나, 3D 타입(scatter3d, mesh3d)의 그래프는 " WebGL is not supported by your browser" 문구와 함께 canvas가 생성되지 않는.. 2024. 5. 17.