2013-02-11 48 views
0
template.html 
<script src="http://code.highcharts.com/highcharts.js"> 
</script> 
<script > 
$(document).ready(function() { 
var chart = new Highcharts.Chart({ 

    chart: { 
     renderTo: 'container', 
     type: 'line' 
    }, 
    title: { 
     text: 'Power Consumption Vs Generator Consumption' 
    }, 
    xAxis: { 
     categories: [{{month_number|join:"','" }}] 
    }, 
    yAxis: { 
     title: { 
      text: 'Fruit eaten' 
     } 
    }, 

    // series: [{ 
     // name: 'Truepower Consumed', 
     // data: [1, 0, 4]}, 
    // { 
     // name: 'Generator Consumed', 
     // data: [5, 7, 3]}], 
// }); 
series: [{ 
     name: 'Truepower Consumed', 
     data: [ '{{ p|join:"','" }}']}, 
    { 
     name: 'Generator Consumed', 
     data: [ '{{ q|join:"','" }}']}], 
}); 

});如何將視圖中的值傳遞給模板以繪製曲線圖

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 
    q2=KEBReading.objects.filter().values("truepower_consumed") 
    print q2 
    q3=GeneratorReading.objects.filter().values("perday_dgunit") 
    print q3 
    for item in q2: 
     power_values=item["truepower_consumed"] 
     print power_values 
    print "tee" 
    for item in q3: 
     gen_values=item["perday_dgunit"] 
     print gen_values 
    context={'m':month_number,'p':power_values,'q':gen_values}  
    return render_to_response('graph.html',context, 
           context_instance=RequestContext(request)) 

即時通訊試圖繪圖。我可以知道如何將視圖中的值傳遞給圖形的jQuery。 上下文= { 'M':MONTH_NUMBER, 'P':power_values, 'Q':gen_values} p和q是y軸的值和m的x軸值

models.py 


class KEBReading(models.Model): 

    datetime_reading=models.DateTimeField() 

    truepower_reading=models.DecimalField(verbose_name="True Power       Reading(KWH)",max_digits=6,decimal_places=2,blank=False,null=False) 
apparentpower_reading=models.DecimalField(verbose_name="Apparent Power Reading(KVAH)",max_digits=6,decimal_places=2,blank=False,null=False) 
truepower_consumed=models.DecimalField(max_digits=6,decimal_places=2,blank=False,null=False) 
voltage_reading=models.IntegerField(blank=False,null=False) 
powerfactor=models.DecimalField(max_digits=3,decimal_places=2) 



class GeneratorReading(models.Model): 

    datetime_reading=models.DateTimeField() 

running_time=models.IntegerField(blank=False,null=False) 
running_time_consumed=models.SmallIntegerField(blank=False,null=False) 
dgunit_reading=models.DecimalField(max_digits=6, blank=True,decimal_places=2) 
perday_dgunit=models.DecimalField(max_digits=6, decimal_places=2) 
+0

你從哪裏得到perday_dgunit? – catherine 2013-02-11 11:10:23

+0

我在我的應用程序中使用了highcharts,我想回答這個問題,但如果我發佈它,它會很長。 – catherine 2013-02-11 13:14:06

+0

現在爲我工作。我做了一個Ajax請求來獲取數據並將json對象傳遞給jquery。無論如何感謝很多 – prithu 2013-02-11 13:21:25

回答

0

當我需要這種行爲,我經常編寫一個過濾器,將我的Object或Queryset轉換爲json對象。

def jsonify(object): 
    if isinstance(object, QuerySet): 
     return serialize('json', object) 
    return simplejson.dumps(object) 

register.filter('jsonify', jsonify) 

<script id="json_data" type="text/javascript"> 
    {{ my_data|jsonify|safe }} 
</script> 
相關問題