Chartjs-Create Line Chart and populate with database information

by

1👍

✅

You need to pass your data to the web template. Something like: 

def data(request, id):
    variables = {}
    variables['line1'] = [1, 2, 3, 4]
    variables['line2'] = [4, 3, 2, 1]
    variables['line3'] = [1, 3, 5, 7]
    variables['user_id'] = id
    return render(request, 'interface/data.html', variables)

Then you need to render in the template (This isn’t quite right but I’m sure you can work it out from here)

<div id="mychart"></div>
<script src="path/to/chartjs/dist/Chart.js"></script>
<script>
var myChart = new Chart(ctx, {
    type: 'line',
    data: data,
    options: options
});
var data = [
datasets: [{
  data: {{line1}},
},{
  data: {{line2}},
},{
  data: {{line3}}
}

Leave a comment