<script>
    {# bar graph for year #}
    var canvasP = document.getElementById("bar-chart-year");
    var ctxP = canvasP.getContext('2d');
    var bar_chart_year = new Chart(ctxP, {
        type: 'bar',
        data: {
            labels: [{% for data in dataset_list %}"{{ data.title }}",{% endfor %}],
            datasets: [{
                backgroundColor: [{% for data in dataset_list %}{{ data.color }},{% endfor %}],
                data: [{% for data in dataset_list %}{{ data.year }},{% endfor %}]
            }]
        },
        options: {
            title: {
                display: {% if chart_display_title %}true{% else %}false{% endif %},
                text: 'Year',
                fontSize: 20,
                position: "bottom"
            },
            legend: {
                display: {% if chart_display_legend %}true{% else %}false{% endif %},
                position: "bottom"
                },
            scales: {
                yAxes: [{
                    ticks: {
                        beginAtZero: true
                    }
                }]
            }
        }
    });

    canvasP.onclick = function(e) {
        var slice = bar_chart_year.getElementAtEvent(e);
        if (!slice.length) return; // return if not clicked on slice
        var label = slice[0]._model.label;
        switch (label) {
            {% for data in dataset_list %}
            case '{{ data.title }}':
                location.href = "{{ data.list_view }}?{{ data.dt_field }}__gte={{ last_year|date:'Y-m-d H:i:s' }}&page_description=added in the past year";
                break;
            {% endfor %}
        }
    }
 </script>
