Revamped Our Rainfall Monitoring System
I had mentioned that I was digging ReactJS in my last post, so I applied what I have learned about it to revamp our rainfall monitoring system.
It's funny how we code last day, month or year is very much different compared today. It's not bad though, that means we're (I'm) improving or there's a progress. The system before uses JavaScript, JQuery, Openlayers and a JavaScript library for date formatting.
Here's how it works:
Now, like I said, there's a progress.
Aside from using ReactJS, I also changed how it works.
I also used, LeafletJS for its mapping library, Bootstrap (sadly need to use JQuery), and momentjs for date formatting. Deployed it in Heroku.
The code is here with comments in "Weather.jsx", just change the station ids.
It's funny how we code last day, month or year is very much different compared today. It's not bad though, that means we're (I'm) improving or there's a progress. The system before uses JavaScript, JQuery, Openlayers and a JavaScript library for date formatting.
Here's how it works:
- Request data from a different (an external) domain(server)
- Get the latest value and append it to the pre-defined GeoJSON object
- Evaluate the value to determine its rainfall intensity
- Finally, plot it on the map
Now, like I said, there's a progress.
Aside from using ReactJS, I also changed how it works.
- Request data from a different (an external) domain(server).
- Get all the data (not just the last value) from all available stations and store it in an array of objects
- Extract the last value from the array , evaluate to determine its rainfall intensity then plot it.
- Data is also displayed as table.
I also used, LeafletJS for its mapping library, Bootstrap (sadly need to use JQuery), and momentjs for date formatting. Deployed it in Heroku.
The code is here with comments in "Weather.jsx", just change the station ids.