2013-07-18 5 views
2

Я пытаюсь получить диаграммы Google, отображаемые на моей странице, но я не могу понять, как передать значения из представлений django в javascript, чтобы я мог рисовать диаграммы.Django с диаграммами Google

Джанго код:

array = ([ 
     ['Year', 'Sales', 'Expenses'], 
     ['2004', 1000,  400], 
     ['2005', 1170,  460], 
     ['2006', 660,  1120], 
     ['2007', 1030,  540] 
    ]); 
args['array']= array 
return render_to_response('progress.html',args) 

progres.html:

<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
<script type="text/javascript"> 
    google.load("visualization", "1", {packages:["corechart"]}); 
    google.setOnLoadCallback(drawChart); 
    function drawChart() { 
    var djangoData = '{{array}}'; 
    var data = google.visualization.arrayToDataTable(djangoData); 

    var options = { 
     title: 'Company Performance' 
    }; 

    var chart = new google.visualization.LineChart(document.getElementById('chart_div')); 
    chart.draw(data, options); 
    } 
</script> 

Таким образом, не получает отображается на графике. Какие-либо предложения ?

ответ

1

google.visualization.arrayToDataTable(), похоже, принимает 2D (javascript) массив. То, что вы передаете, это строка. Вам нужно проанализировать его в массиве. Попробуйте:

var djangoData = JSON.parse('{{ array }}'); 
var data = google.visualization.arrayToDataTable(djangoData); 
0

В вашем зрения:

удалить эту строку args['array']= array

изменение этой линии return render_to_response('progress.html',args)кreturn render_to_response('progress.html',{'array': json.dumps(array)})

В вашем шаблоне:

изменение этой линии var djangoData = '{{array}}';кvar djangoData = '{{ array | safe }}';

Остальная часть кода в порядке. Надеюсь, это поможет.

Смежные вопросы