谷歌圖表（表格）中的django變量api

Question

Iam對Google圖表API很新穎，我試圖將它集成到我的currentn django項目中。基本上，我已經得到了Django模板看起來像下面這樣：

<div class="container_24"> 
<div class="grid_24"> 
    {% if query %} 
     <p>Results</p> 

     {% for result in page.object_list %} 
      <p> 
       <a href="{{ result.object.get_absolute_url }}">{{ result.object.name }} {{ result.object.salary }} {{ result.object.entry }} {{ result.object.category}}</a> 
      </p> 
     {% empty %} 
      <p>No results found.</p> 
     {% endfor %} 

     {% if page.has_previous or page.has_next %} 
      <div> 
       {% if page.has_previous %}<a href="?q={{ query }}&amp;page={{ page.previous_page_number }}">{% endif %}&laquo; Previous{% if page.has_previous %}</a>{% endif %} 
       | 
       {% if page.has_next %}<a href="?q={{ query }}&amp;page={{ page.next_page_number }}">{% endif %}Next &raquo;{% if page.has_next %}</a>{% endif %} 
      </div> 
     {% endif %} 
    {% else %} 
     {# Show some example queries to run, maybe query syntax, something else? #} 
    {% endif %} 
</div> 
<div class="fclear"></div> 
</div> 
<div class="clear"></div> 
</div> 
</div> 

一切都很好，我可以看到我的結果如預期。現在我插入谷歌圖表API如下：

<div class="container_24"> 
<div class="grid_24"> 
{% if query %} 
    <p>Results</p> 

    {% for result in page.object_list %} 
<script type='text/javascript' src='https://www.google.com/jsapi'></script> 
<script type='text/javascript'> 
    google.load('visualization', '1', {packages:['table']}); 
    google.setOnLoadCallback(drawTable); 
    function drawTable() { 
    var data = new google.visualization.DataTable(); 
    data.addColumn('string', 'Name'); 
    data.addColumn('number', 'Salary'); 
    data.addColumn('boolean', 'Full Time Employee'); 
    data.addRows(4); 
    data.setCell(0, 0, '{{ result.object.name }}'); 
    data.setCell(0, 1, 10000, '$10,000'); 
    data.setCell(0, 2, true); 
    data.setCell(1, 0, '{{ result.object.name }}'); 
    data.setCell(1, 1, 8000, '$8,000'); 
    data.setCell(1, 2, false); 
    data.setCell(2, 0, '{{ result.object.name }}'); 
    data.setCell(2, 1, 12500, '$12,500'); 
    data.setCell(2, 2, true); 
    data.setCell(3, 0, '{{ result.object.name }}'); 
    data.setCell(3, 1, 7000, '$7,000'); 
    data.setCell(3, 2, true); 

    var table = new google.visualization.Table(document.getElementById('table_div')); 
    table.draw(data, {showRowNumber: true}); 
    } 
</script> 
.. 
.. 
.. 

但是，當我這樣做時，我看到變量result.object.name同名。也就是說，它並沒有循環遍歷這個數組。有沒有辦法做這樣的事情：

data.setCell(0:20,0)='{{result.object.name}}' 

其中0:20會代表表/行的行嗎？

謝謝你的時間。

Answer 1

如果我正確理解你的問題的一個辦法是循環這樣的：

{% for n in result.object.name %} 

    data.setCell({{ forloop.counter0 }}, 0, '{{ n }}'); 

{% endfor %} 

我強烈從這樣氣餒，因爲它容易JS注射和你不得不逃離則JavaScript和你的模板。我會建議使用谷歌圖包裝： http://code.google.com/p/google-chartwrapper/

https://github.com/jacobian/django-googlecharts/

http://code.google.com/p/django-graphs/

至於我記得Django的googlecharts工作得很好，你就可以使用標籤直接進入你的模板。