基于此Highcharts示例(HTML中包含的javascript代码):http://jsfiddle.net/f4Ef7/
我有一个模板,我想嵌入JavaScript代码,而不必包含任何静态。浏览器正在处理与JS无关的任何内容。目前我的views.py看起来像:
# -*- encoding: utf-8 -*-
from django.shortcuts import render
from django.http import HttpResponse
from tfgplot.models import estado_foneras
from django.template import RequestContext, loader
from tfgplot.models import estado_foneras
def index(request):
clave = estado_foneras.objects.order_by('clave')
template = loader.get_template('tfgplot/index.html')
context = RequestContext(request, {
'clave': clave,
})
return render(request, 'tfgplot/index.html', context)
如果我使用以下代码,它会完美地绘制,我得到了我期望的结果:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
</head>
<body>
<div id="container" style="min-width: 300px; height: 300px; margin: 1em">
</div>
<script type="text/javascript">
{% autoescape off %}
$(document).ready(function(){
$('#container').highcharts({
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
series: [{
data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
}]
});
});
{% endautoescape %}
</script>
</body>
</html>
我还能够在我想在JS中使用的值的html中编写一个列表。因此,我可以使用<ul><li>
标记在.html中显示数据,并使用{{ classK.attr1 }}
在循环中显示所有记录。
现在,问题是我需要绘制存储在sqlite3数据库中的值。每个类别都有数据值(即图中每个X值的一个Y轴值)。这两个值位于表格的每一行。我尝试过很多东西:
$(document).ready(function(){
$('#container').highcharts({
xAxis: {
categories: {{ classK.attr1 }}
},
series: [{
data: {{ classK.attr2 }}
}]
});
});
有什么建议,所以我可以将所有这些数据库值用作X轴和Y轴的一种数组吗?
答案 0 :(得分:1)
您发送到模板的唯一变量称为“clave”,但您尝试使用名为“classK”的变量。也许您没有将变量发送到您认为自己的模板?