Spaces:
				
			
			
	
			
			
		Sleeping
		
	
	
	
			
			
	
	
	
	
		
		
		Sleeping
		
	Update plot_week.html
Browse files- plot_week.html +66 -61
    	
        plot_week.html
    CHANGED
    
    | @@ -186,71 +186,76 @@ document.addEventListener("DOMContentLoaded", function () { | |
| 186 | 
             
                </div>
         | 
| 187 |  | 
| 188 | 
             
                <script>
         | 
| 189 | 
            -
             | 
| 190 | 
            -
             | 
| 191 | 
            -
             | 
| 192 | 
            -
             | 
| 193 | 
            -
             | 
| 194 | 
            -
             | 
| 195 | 
            -
             | 
| 196 | 
            -
             | 
| 197 | 
            -
             | 
| 198 | 
            -
             | 
| 199 | 
            -
             | 
| 200 | 
            -
             | 
| 201 | 
            -
             | 
| 202 | 
            -
             | 
| 203 | 
            -
                            xaxis: { title: "", showticklabels: false },
         | 
| 204 | 
            -
                            yaxis: { title: yLabel, titlefont: { size: 14 } },
         | 
| 205 | 
            -
                            hovermode: "closest",
         | 
| 206 | 
            -
                            showlegend: false
         | 
| 207 | 
            -
                        });
         | 
| 208 | 
            -
                    }
         | 
| 209 | 
            -
                    createChart("ph_chart", data.ph, `График pH за ${data.week}-ю неделю`, "Уровень pH", "blue");
         | 
| 210 | 
            -
                    createChart("ec_chart", data.ec, `График EC за ${data.week}-ю неделю`, "Уровень EC", "blue");
         | 
| 211 | 
            -
                    createChart("ts_chart", data.tS, `Температура раствора за ${data.week}-ю неделю`, "Температура (°C)", "purple");
         | 
| 212 | 
            -
                    createChart("ta_chart", data.tA, `Температура воздуха за ${data.week}-ю неделю`, "Температура (°C)", "purple");
         | 
| 213 | 
            -
                    createChart("hdm_chart", data.hDm, `Влажность воздуха за ${data.week}-ю неделю`, "Влажность (%)", "purple");
         | 
| 214 | 
            -
                    createChart("sven_chart", data.sVen, `Обороты вентилятора за ${data.week}-ю неделю`, "Обороты (%)", "purple");
         | 
| 215 | 
            -
                    Plotly.newPlot("pump_chart", [
         | 
| 216 | 
            -
                        {
         | 
| 217 | 
            -
                            x: data.dates,
         | 
| 218 | 
            -
                            y: data.onA,
         | 
| 219 | 
            -
                            type: "scatter",
         | 
| 220 | 
            -
                            mode: "lines+markers",
         | 
| 221 | 
            -
                            line: { color: "green" },
         | 
| 222 | 
            -
                            hovertemplate: data.days_of_week.map((day, index) =>
         | 
| 223 | 
            -
                                `Неделя: ${data.week}<br>День: ${day}<br>Время системы: ${data.sus[index]}<br>Насос A: %{y} сек.<br>Дата: ${data.dates[index]}`
         | 
| 224 | 
            -
                            )
         | 
| 225 | 
            -
                        },
         | 
| 226 | 
            -
                        {
         | 
| 227 | 
            -
                            x: data.dates,
         | 
| 228 | 
            -
                            y: data.onB,
         | 
| 229 | 
            -
                            type: "scatter",
         | 
| 230 | 
            -
                            mode: "lines+markers",
         | 
| 231 | 
            -
                            line: { color: "brown" },
         | 
| 232 | 
            -
                            hovertemplate: data.days_of_week.map((day, index) =>
         | 
| 233 | 
            -
                                `Неделя: ${data.week}<br>День: ${day}<br>Время системы: ${data.sus[index]}<br>Насос A: %{y} сек.<br>Дата: ${data.dates[index]}`
         | 
| 234 | 
            -
                            )
         | 
| 235 | 
            -
                        },
         | 
| 236 | 
            -
                        {
         | 
| 237 | 
            -
                            x: data.dates,
         | 
| 238 | 
            -
                            y: data.onC,
         | 
| 239 | 
            -
                            type: "scatter",
         | 
| 240 | 
            -
                            mode: "lines+markers",
         | 
| 241 | 
            -
                            line: { color: "orange" },
         | 
| 242 | 
            -
                            hovertemplate: data.days_of_week.map((day, index) =>
         | 
| 243 | 
            -
                                `Неделя: ${data.week}<br>День: ${day}<br>Время системы: ${data.sus[index]}<br>Насос A: %{y} сек.<br>Дата: ${data.dates[index]}`
         | 
| 244 | 
            -
                            )
         | 
| 245 | 
            -
                        }
         | 
| 246 | 
            -
                    ], {
         | 
| 247 | 
            -
                        title: `Интервал дозирования насосов для ${data.week}-ой недели`,
         | 
| 248 | 
             
                        xaxis: { title: "", showticklabels: false },
         | 
| 249 | 
            -
                        yaxis: { title:  | 
| 250 | 
             
                        hovermode: "closest",
         | 
| 251 | 
             
                        showlegend: false
         | 
| 252 | 
             
                    });
         | 
| 253 | 
            -
                 | 
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
| 254 | 
             
            {% else %}
         | 
| 255 | 
             
                <div class="no-data-message">
         | 
| 256 | 
             
                    {{ message if message else 'Данных за эту неделю нет в базе данных.' }}
         | 
|  | |
| 186 | 
             
                </div>
         | 
| 187 |  | 
| 188 | 
             
                <script>
         | 
| 189 | 
            +
                const data = {{ data | tojson }};
         | 
| 190 | 
            +
             | 
| 191 | 
            +
                function createChart(id, yData, title, yLabel, color, parameterName, unit) {
         | 
| 192 | 
            +
                    Plotly.newPlot(id, [{
         | 
| 193 | 
            +
                        x: data.dates,
         | 
| 194 | 
            +
                        y: yData,
         | 
| 195 | 
            +
                        type: "scatter",
         | 
| 196 | 
            +
                        mode: "lines+markers",
         | 
| 197 | 
            +
                        line: { color: color },
         | 
| 198 | 
            +
                        hovertemplate: data.days_of_week.map((day, index) =>
         | 
| 199 | 
            +
                            `Неделя: ${data.week}<br>День: ${day}<br>Время системы: ${data.sus[index]}<br>${parameterName}: %{y} ${unit}<br>Дата: ${data.dates[index]}<extra></extra>`
         | 
| 200 | 
            +
                        )
         | 
| 201 | 
            +
                    }], {
         | 
| 202 | 
            +
                        title: title,
         | 
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
|  | |
| 203 | 
             
                        xaxis: { title: "", showticklabels: false },
         | 
| 204 | 
            +
                        yaxis: { title: yLabel, titlefont: { size: 14 } },
         | 
| 205 | 
             
                        hovermode: "closest",
         | 
| 206 | 
             
                        showlegend: false
         | 
| 207 | 
             
                    });
         | 
| 208 | 
            +
                }
         | 
| 209 | 
            +
             | 
| 210 | 
            +
                // Создание графиков с правильными подсказками
         | 
| 211 | 
            +
                createChart("ph_chart", data.ph, `График pH за ${data.week}-ю неделю`, "Уровень pH", "blue", "pH", "");
         | 
| 212 | 
            +
                createChart("ec_chart", data.ec, `График EC за ${data.week}-ю неделю`, "Уровень EC", "blue", "EC", "мкСм/см");
         | 
| 213 | 
            +
                createChart("ts_chart", data.tS, `Температура раствора за ${data.week}-ю неделю`, "Температура (°C)", "purple", "Температура раствора", "°C");
         | 
| 214 | 
            +
                createChart("ta_chart", data.tA, `Температура воздуха за ${data.week}-ю неделю`, "Температура (°C)", "purple", "Температура воздуха", "°C");
         | 
| 215 | 
            +
                createChart("hdm_chart", data.hDm, `Влажность воздуха за ${data.week}-ю неделю`, "Влажность (%)", "purple", "Влажность воздуха", "%");
         | 
| 216 | 
            +
                createChart("sven_chart", data.sVen, `Обороты вентилятора за ${data.week}-ю неделю`, "Обороты (%)", "purple", "Обороты вентилятора", "%");
         | 
| 217 | 
            +
             | 
| 218 | 
            +
                // График насосов
         | 
| 219 | 
            +
                Plotly.newPlot("pump_chart", [
         | 
| 220 | 
            +
                    {
         | 
| 221 | 
            +
                        x: data.dates,
         | 
| 222 | 
            +
                        y: data.onA,
         | 
| 223 | 
            +
                        type: "scatter",
         | 
| 224 | 
            +
                        mode: "lines+markers",
         | 
| 225 | 
            +
                        line: { color: "green" },
         | 
| 226 | 
            +
                        hovertemplate: data.days_of_week.map((day, index) =>
         | 
| 227 | 
            +
                            `Неделя: ${data.week}<br>День: ${day}<br>Время системы: ${data.sus[index]}<br>Насос A: %{y} сек.<br>Дата: ${data.dates[index]}<extra></extra>`
         | 
| 228 | 
            +
                        )
         | 
| 229 | 
            +
                    },
         | 
| 230 | 
            +
                    {
         | 
| 231 | 
            +
                        x: data.dates,
         | 
| 232 | 
            +
                        y: data.onB,
         | 
| 233 | 
            +
                        type: "scatter",
         | 
| 234 | 
            +
                        mode: "lines+markers",
         | 
| 235 | 
            +
                        line: { color: "brown" },
         | 
| 236 | 
            +
                        hovertemplate: data.days_of_week.map((day, index) =>
         | 
| 237 | 
            +
                            `Неделя: ${data.week}<br>День: ${day}<br>Время системы: ${data.sus[index]}<br>Насос B: %{y} сек.<br>Дата: ${data.dates[index]}<extra></extra>`
         | 
| 238 | 
            +
                        )
         | 
| 239 | 
            +
                    },
         | 
| 240 | 
            +
                    {
         | 
| 241 | 
            +
                        x: data.dates,
         | 
| 242 | 
            +
                        y: data.onC,
         | 
| 243 | 
            +
                        type: "scatter",
         | 
| 244 | 
            +
                        mode: "lines+markers",
         | 
| 245 | 
            +
                        line: { color: "orange" },
         | 
| 246 | 
            +
                        hovertemplate: data.days_of_week.map((day, index) =>
         | 
| 247 | 
            +
                            `Неделя: ${data.week}<br>День: ${day}<br>Время системы: ${data.sus[index]}<br>Насос C: %{y} сек.<br>Дата: ${data.dates[index]}<extra></extra>`
         | 
| 248 | 
            +
                        )
         | 
| 249 | 
            +
                    }
         | 
| 250 | 
            +
                ], {
         | 
| 251 | 
            +
                    title: `Интервал дозирования насосов для ${data.week}-ой недели`,
         | 
| 252 | 
            +
                    xaxis: { title: "", showticklabels: false },
         | 
| 253 | 
            +
                    yaxis: { title: "Время ВКЛ(сек.)" },
         | 
| 254 | 
            +
                    hovermode: "closest",
         | 
| 255 | 
            +
                    showlegend: false
         | 
| 256 | 
            +
                });
         | 
| 257 | 
            +
            </script>
         | 
| 258 | 
            +
             | 
| 259 | 
             
            {% else %}
         | 
| 260 | 
             
                <div class="no-data-message">
         | 
| 261 | 
             
                    {{ message if message else 'Данных за эту неделю нет в базе данных.' }}
         |