[FIXED] passing a tuple in a Google charts table using Django

Issue

Good afternoon everyone,

I am implementing Google Charts API in my Django project. I would like to draw two different charts, a pie chart and a table chart. I am able to display the Pie chart without problems. However, I am having trouble with the table chart. I am passing a tuple to the data.setCell() method. When I do that the table chart does not render. Hereunder is the code that I wrote:

function drawTable() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Company Name');
    data.addColumn('number', '52 week high');
    data.addColumn('number', '52 week low');
    data.addRows(5);
    {% for company in data_cell|safe %}
        data.setCell(company);
    {% endfor %}
    
    // data.setCell(0, 0, 'John');
    
    
    var table = new google.visualization.Table(document.getElementById('table_div'));
    table.draw(data, {showRowNumber: true, width: '50%', height: '50%'});

    google.visualization.events.addListener(table, 'select', function() {
        var row = table.getSelection()[0].row;
        alert('You selected ' + data.getValue(row, 0));
    });
}    

data_cell is a variable that contains a list of tuples and it is part of the context dictionary in my views.py file. As follows you can find an example; ('Facebook', 384.33, 244.61)

I have tried looping through the list of tuples without the safe method and it does not work.

Any hints?

Solution

instead of using setCell, try the addRow method...

data.addRow(company);

setCell requires three arguments --> row index, column index, and value.
you cannot pass all in one variable.

Answered By - WhiteHat