123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132 |
- {% extends "index.html" %}
- {% block title %}智能最佳化{% endblock %}
- {% block head %}
- {{ super() }}
- {% endblock %}
- {% block body %}
- <div id="select_histories">
- <div id="select_histories_1">
- <select>
- <option></option>
- </select>
-
- <button id="search">搜尋</button>
- </div>
-
- </div>
- <div id="tower_temperature">
- <div id="tower_temperature">
- <div scr="hot_water" style="width: 300px;height:300px;color: #26b72b;float:left">熱水溫度</div>
- <font size="1">Hot temp: {{ temp }}</font><br>
- <div id="cold_water" style="width: 300px;height:300px;color: #8600FF;float:left">冷水溫度</div>
- <font size="1">Cold temp: {{ temp2 }}</font><br>
- <div id="wet_water" style="width: 300px;height:300px;color: #737300;float:left">濕球溫度</div>
- <font size="1">Wet temp: {{ temp3 }}</font><br>
- </div>
- <style>
- table {
- font-family: arial, sans-serif;
- border-collapse: collapse;
- width: 50%;
- }
- td, th {
- border: 1px solid #dddddd;
- text-align: left;
- padding: 8px;
- }
- tr:nth-child(even) {
- background-color: #dddddd;
- }
- </style>
- <body>
- <table>
- <tr>
- <th>當前狀態</th>
- <th></th>
- </tr>
- <tr>
- <td>水流量</td>
- <td>M*3/H</td>
- </tr>
- <tr>
- <td>風扇數</td>
- <td>台</td>
- </tr>
- </table>
- <table>
- <tr>
- <th>效能最佳化</th>
- <th></th>
- </tr>
- <tr>
- <th>目前溫度</th>
- <th>度C</th>
- </tr>
- <tr>
- <td>流量建議調整為</td>
- <td>M*3/H</td>
- </tr>
- <tr>
- <td>可節省水費</td>
- <td>元/天</td>
- </tr>
- <tr>
- <td>風扇建議調整為</td>
- <td>台</td>
- </tr>
- <tr>
- <td>可節省電費</td>
- <td>元/天</td>
- </tr>
- <tr>
- <td>總節省費用</td>
- <td>元/天</td>
- </tr>
- </table>
- <script type="text/javascript">
- var hot_water = echarts.init(document.getElementById("hot_water"));
- var cold_water = echarts.init(document.getElementById("cold_water"));
- var wet_water = echarts.init(document.getElementById("wet_water"));
-
- let date = transform_time_to_string(new Date());
- fetch(`/temperature/date=${date}`)
- .then(function(response) {
- return response.json();
- })
- .then(function(myJson) {
- // 配置圖表資訊
- console.log(myJson);
- option = {
- series: [{
- type: 'liquidFill',
- data: myJson['hot_water']
- }]
- };
- hot_water.setOption(option);
- option = {
- series: [{
- type: 'liquidFill',
- data: myJson['cold_water']
- }]
- };
- cold_water.setOption(option);
- option = {
- series: [{
- type: 'liquidFill',
- data: myJson['wet_water']
- }]
- };
- wet_water.setOption(option);
-
- });
-
- </script>
- {% endblock %}
|