使用Django Chartit显示图形

时间:2013-02-08 11:54:42

标签: django

graphs.html 


{% extends "base.html" %}
<script type = "text/javascript" src = "{{ STATIC_URL }}js/highcharts.js"></script>
<script type = "text/javascript" src = "{{ STATIC_URL }}js/jquery-1.9.1.min.js">                                                                                                                                                 </script>
<body >
{% block menu %}
{{block.super}}
{% endblock menu %}

{% block content %}
 {{weatherchart}}


<!-- code to include the highcharts and jQuery libraries goes here -->
<!-- load_charts filter takes a comma-separated list of id's where -->
<!-- the charts need to be rendered to                             -->
{% load chartit %}
{{ weatherchart|load_charts:"container" }
 <div id='container'>  </div>
  {% endblock content %}
</body>



views.py


def plot_graph(request):
month_number=[]
months=KEBReading.objects.filter().values("datetime_reading")
print months
for obj in months:
    month_number=obj["datetime_reading"].day
    print month_number
#Step 1: Create a DataPool with the data we want to retrieve.
weatherdata = \
    DataPool(
       series=
        [{'options': {
           'source': KEBReading.objects.filter().values("id","truepower_consumed","voltage_reading")},
          'terms': [
            'id',
            'truepower_consumed','voltage_reading'
           ]}])





#Step 2: Create the Chart object
cht = Chart(
        datasource = weatherdata,
        series_options =
          [{'options':{
              'type': 'line',
              'stacking': False},
            'terms':{
              'id': [
                'truepower_consumed','voltage_reading']


              }}],

        chart_options =
          {'title': {
               'text': 'Graph For Power Management'},
           'xAxis': {
                'title':{'text': 'month_number'}}})
print "weather chart"
print cht

#Step 3: Send the chart object to the template.
return render_to_response('graph.html',{'weatherchart': cht},context_instance=RequestContext(request))

我在使用Django-Chartit时遇到问题。我想使用数据库中的数据制作图表。 我上面做过。但图表没有显示出来。我是以正确的方式做到的。 感谢帮助。提前致谢。是模板中缺少的其他东西。(graphs.html)

2 个答案:

答案 0 :(得分:1)

尝试

{% extends "base.html" %}
{% load chartit %}
{% block scripts %}
{{ weatherchart|load_charts:"container" }}
{% endblock %}

其中,block脚本是所有js文件的标记。 确保在highcharts之前加载jquery

答案 1 :(得分:0)

我遇到了同样的问题,并偶然发现了未在任何地方记录的解决方案,为了让我能够工作,我必须将load_charts调用放在“容器”DIV中,就像这样......

<div id="container">{{ chart|load_charts:"container" }}</div>

在HTML中为DIV ID使用双引号而不是上面记录的单引号也是一种很好的做法。