Hi!
I'm Ayush Zenith. A high school sophomore from Andover High School, Andover, Massachusetts and this page is about an application I built for Andover High with Energize Andover
To learn more about me check out my Website.
- Clone or Download BACnet-AHS-electric-gauge
- Run Main.py
- Wait for 30 seconds for buffer/reload/connectivity time
- Open index.html in your browser Note - file index.html would be the start up file for any apache configuration and documentroot would be .py
Simply put 'Gauges'
The application in its current stage basically a live gauge for monitering electricity usage around Andover High School.
- AHS Main(Power usage for all of AHS)
- AHS GYM(Power usage for the gym's)
- AHS Colins Center(Power usage for the collins center building)
- AHS Kitchen(Power usage for the kitchen)
- kW(Kilowatt)
- kWh(Kilowatt hour)(Starts to calculate the kWh since the server has been running)
- Cost $$(Cost in dollars)(Starts to calculate the dollars since the server has been running)
- kWh(Kilowatt hour) hourly for school hours(Still in testing)
- Python
- BACnet
- HTML
- CSS
- JS
- SVG
- Pandas
- Pygal
- AJAX
- JQuery
- Main.py
- Main.py is the file that is going to be run on the server hosting the website.
- Main.py is the back end for the server
- Main.py has a function called 'myFunction()' that takes in a String. The String being the location and the unit the user would like their data from the BACnet server.
- Ex-"Main (kWh)"
- Main.py takes the values the BACnet server returns and uses the pygal library to generate half solid gauges.
- Main.py also takes in values every hour from 6 am - 3 pm to generate a gauge for kWh hourly school usage
- The pygal library then take the values and generates a .svg file with the solid gauges in it.
- bacnet_gateway_requests.py
- This is just one of the files that the BACnet API needs
- ahs_elec.csv
- This is just one of the files that the BACnet API needs
- index.html
- This is one of the three HTML files that make up our web application
- This file in named index.html for easy configuration with apache
- This file is shows the electricity used in kilowatts
- Noteable things about the file:
- Using AJAX and JQuery to refresh only the svg object
- There are 3 buttons on the side with functions:
- kW opens up index.html
- kWh opens up kWh.html
- Cost $$ opens up dollars.html
- The gauges in the center are svg files that pygal makes and when the page refreshes it looks for the new svg file pygal generated for us and displays that with the new data
- kWh.html
- This is one of the three HTML files that make up our web application
- This file in named kWh.html because it shows the electricity used in kilowatt hours
- It starts to calculate kWh used since Main.py started to run
- Noteable things about the file:
- Using AJAX and JQuery to refresh only the svg object
- There are 3 buttons on the side with functions:
- kW opens up index.html
- kWh opens up kWh.html
- Cost $$ opens up dollars.html
- The gauges in the center are svg files that pygal makes and when the page refreshes it looks for the new svg file pygal generated for us and displays that with the new data
- dollars.html
- This is one of the three HTML files that make up our web application
- This file in named dollars.html because it shows the electricity used in dollars or cost
- It starts to calculate cost used since Main.py started to run
- Noteable things about the file:
- Using AJAX and JQuery to refresh only the svg object
- There are 3 buttons on the side with functions:
- kW opens up index.html
- kWh opens up kWh.html
- Cost $$ opens up dollars.html
- The gauges in the center are svg files that pygal makes and when the page refreshes it looks for the new svg file pygal generated for us and displays that with the new data
- kw.svg
- This is one of the svg's generated/rendered by pygal
- kwh.svg
- This is one of the svg's generated/rendered by pygal
- dollars.svg
- This is one of the svg's generated/rendered by pygal
- In every solid gauge the amount of electricity is written below
- When the cursor is taken over one of the solid gauges it displays the amount of electricity used in a nice cool box.
- When cursor is taken over the buttons they change color and the cursor changes too
- Gauges can be hidden by clicking the key in the left
- The page refreshes every 15 seconds resettign any kind of zoom that might have been set or resetting any graphics with the gauges
- Currently working on making a full big 360 gauge that has 10 pointers each appearing at every hour interval to see how much electricity was used in every hour.
Credits
Contact me
- Ayush Zenith