templates/solar_flow.html

{% extends 'base.html' %}
{% block content %}
    <h2>Hệ thống Điện Mặt trời (Solar PV System)</h2>
    <p>Diễn giải luồng năng lượng từ tấm pin mặt trời đến các thiết bị trong nhà:</p>

    <div style="text-align: center; margin-bottom: 20px;">
        <p><strong>Điều khiển hoạt hình:</strong></p>
        <button onclick="startAnimation()">Bắt đầu Hoạt hình</button>
        <button onclick="stopAnimation()">Dừng Hoạt hình</button>
    </div>

    <canvas id="solarCanvas" width="750" height="400" style="border:1px solid #d3d3d3; background-color: #f0f8ff; display: block; margin: auto;"></canvas>

    <div style="margin-top: 20px; text-align: center;">
        <p><strong>Mô tả:</strong></p>
        <ul>
            <li>**Tấm pin:** Thu năng lượng mặt trời.</li>
            <li>**Biến tần:** Chuyển đổi điện một chiều (DC) thành điện xoay chiều (AC).</li>
            <li>**Pin lưu trữ:** Lưu trữ năng lượng dư thừa.</li>
            <li>**Tải nhà:** Năng lượng được sử dụng bởi các thiết bị trong nhà.</li>
        </ul>
    </div>

    <script src="{{ url_for('static', filename='js/solar_animation.js') }}"></script>
{% endblock %}