Question

我已经在这里查看了一些类似的问题：How can I pass data from Flask to JavaScript in a template?

我正在尝试使用this example创建一个谷歌图表，其中我的数据来自数据库查询，然后将其解析并格式化为通过Google的数据源python库传递，然后转换为json字符串。从那里开始，它应该通过我的HTML文件中的JavaScript函数传递，以填充Google Charts表。这最后一部分似乎给我带来了麻烦。这是我在烧瓶中的功能：

    description =  {"count": ("number", "Count"),"type": ("string", "Type")}

    data=[]
    rows = cur.fetchall()
    # formats MySQL data for JSON string 
    for row in rows:
        js = {'type': row[0], 'count': row[1]}
        data.append(js)

    # Loading it into gviz_api.DataTable (from Google Charts template)
    data_table = gviz_api.DataTable(description)
    data_table.LoadData(data)

     # Create a JSON string. (from google charts template)
    json= data_table.ToJSon(columns_order=("type", "count"), order_by="count")



render_template('myhtml.html' , json=json)

在我的函数结束时，然后在我的html文件中传递以下JavaScript函数：

<script>
 ... 
// taken from the Google Charts example
google.load('visualization', '1', {packages:['table']});
google.setOnLoadCallback(drawTable);
var json = '{{ json }}'

function drawTable(json) {
  var json_table = new google.visualization.Table(document.getElementById('table_div_json'));
  var json_data = new google.visualization.DataTable((json), 0.6);
  json_table.draw(json_data, {showRowNumber: true});
}

没有绘制图表，我只剩下图表的标题。我不相信这是我的数据格式或HTML部分（我遗漏了）的问题，因为它直接来自Google Charts模板，所以我一直试图找到我的问题JavaScript（我相当新）。这个字符串不能以这种方式传递给JavaScript函数吗？有什么替代方法可以做到？任何指针和建议都会很棒。

Answer 1

Probably have to escape it, something like:

{{json | safe}}

将来自flask的MySQL数据传递给JavaScript for Google Charts

1 个答案: