Update Google Charts Dashboard cell with HTML value

Question

I have a Google Charts Dashboard instance bound to a ChartWrapper instance that has allowHtml: true, and a DataTable instance that we get from a query response:

...

data = response.getDataTable();
data.setTableProperty("allowHtml", true);

...

dashboard = new google.visualization.Dashboard(document.getElementById('dashboard'));
table = new google.visualization.ChartWrapper({
            'chartType': 'Table',
            'dataTable' : data,
            'containerId': 'table',
            'options' : {'allowHtml': true, 'showRowNumber': true} //,
        });

...

dashboard.bind(filters, table);
dashboard.draw(data);

This enables the drawing of HTML fine. We return plenty of html via the response and it gets drawn to the DOM fine.

The problem comes in when we try to update a value in the chart via the DataTable object ("data" in the above code snippet). When we try to update the values of a cell using the DataTable.setCell() function call with an HTML string, the updated cell just shows the raw HTML and does not format the cell as HTML.

data.setCell(row_index, column_index, response.html);
dashboard.draw(data);

We've set both the ChartWrapper and DataTable options to allowHtml = true, and there doesn't seem to be a way to set the allowHtml property for the Dashboard.

Does anyone have any insight into this? Could it be something wrong with how the objects are bound to one another? According to Google Charts:

A ChartWrapper class is used to wrap your chart and handle all loading, drawing, and Datasource querying for your chart.

Am I supposed to be using a different API for updating the value? I've tried setting column properties, setting table properties, etc to all be allowHtml = true but nothing I've tried has enabled me to update a table with HTML. It always shows the raw HTML string

migreva migreva · Accepted Answer · 2014-08-13T20:39:59

Facepalm

Okay it turns out our serverside code at one point was encoding the HTML string via Django's render_to_string() function, so that things like "<" were being converted to <.

They showed up in the Google Charts as the right values, that is the < value rendered as "<" in the DOM. Once I took out the render_to_string call, everything worked fine.

Update Google Charts Dashboard cell with HTML value

1 Answers