WMGZON/templates/stats.html

<link rel="stylesheet" href="{{ url_for('static', filename='css/products.css') }}">
 

<div>
    <canvas id="myChart" width="800px" height="500px"></canvas>
</div>

<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    const ctx = document.getElementById('myChart');

    new Chart(ctx, {
        type: 'line',
        data: {
            labels: {{headings}},
            datasets: [{
                label: '# of Views',
                data: {{data}},
                borderWidth: 1
            }]
        },
        options: {
            scales: {
                y: {
                    title: {
                        display: true,
                        text: "Num Views"
                    },
                    beginAtZero: true
                },
                x: {
                    title: {
                        display: true,
                        text: "Prev Days"
                    },
                }
            }
        }
    });
</script>

<div class="product-container">
    {% if data != None %}
        {% for stat in data %}
        {% endfor %}
    {% endif %}
</div>