<!-- bar chart canvas element -->
    <canvas id="bar-chart" width="600" height="400"></canvas>
    <script>
       // bar chart data
       var barData = {
       labels : [{% for item in labels %}
                      "{{item}}",
                  {% endfor %}],
       datasets : [
          {
                fillColor: "rgba(151,187,205,0.2)",
                strokeColor: "rgba(151,187,205,1)",
                pointColor: "rgba(151,187,205,1)",
             data : [{% for item in values %}
                          {{item}},
                        {% endfor %}]
          }
          ]
       }

       // get bar chart canvas
       var mychart = document.getElementById("bar-chart").getContext("2d");

       steps = 10
       max = 10
       // draw bar chart
       new Chart(mychart).Bar(barData, {
            scaleOverride: true,
            scaleSteps: steps,
            scaleStepWidth: Math.ceil(max / steps),
            scaleStartValue: 0,
            scaleShowVerticalLines: true,
            scaleShowGridLines : true,
            barShowStroke : true,
            scaleShowLabels: true
       });

    </script>