I'm trying to learn how to pass through my own values/labels to a Highcharts graph using Django, and I've been running into some issues with properly structuring data/passing arguments.
I looked at this example (https://www.highcharts.com/demo/line-basic), and the data looked to be in the shape of an array of arrays, so I figured that's what my series should look like.
This is what my views looks like:
// in views.py:
def make_graph(request):
dates = // A list of datetime.date objects.
values = [1, 2, 3, 4, 5, 2, 3, 5, 3, 3]
data = [[d, v] for d, v in zip(dates, values)]
context = {"data": data}
return render("graph.html", context)
Now, this is my Highcharts script:
<script>
var data = {{ data|safe }};
Highcharts.chart('container', {
chart: {
type: 'spline'
},
title: {
text: 'some title'
},
subtitle: {
text: 'some subtitle'
},
xAxis: {
type: 'datetime',
dateTimeLabelFormats: {
month: '%e. %b',
year: '%b'
},
title: {
text: 'Date'
}
},
yAxis: {
title: {
text: 'y value'
}
},
tooltip: {
headerFormat: '<b>{series.name}</b><br>',
pointFormat: '{point.x:%e. %b}: {point.y:.2f} m'
},
plotOptions: {
spline: {
marker: {
enabled: true
}
}
},
colors: ['#6CF', '#39F', '#06C', '#036', '#000'],
series: [{
name: "Trend",
data: data
}]
});
</script>
When this HTML template is run, no chart appears. It's just a blank page, so I'm guessing the way I structure data
and pass it into the template is wrong. (I've been using a CDN, and the sample charts work, so I don't think its a js issue).
So, my question is, what is the proper way to format data
in views.py
, and how do I correctly set the series data to that data
? Thank you.