使用flask变量作为highcharts的数据源

Question

我从我的数据库中提取数据，我正在尝试将其设置为highcharts的数据。我按以下格式将一个变量从flask传递给我的模板：

[{
  'x': 185.42,
  'team': 'PIT', 
  'y': 99.79,
  'position': 'QB', 
  'f_name': 'Bruce Gradkowski',
  'number': 5
},
{
  'x': 190.5,
  'team': 'DET', 
  'y': 105.23, 
  'position': 'QB', 
  'f_name': 'Matthew Stafford',
  'number': 9
}]

基本上它是一个充满字典的列表。如果我将该文本复制并粘贴到highcharts数据部分，它就像一个魅力。我没有使用jsonify或.getJSON（主要是因为我一直在网上查找但仍然没有清楚知道如何将数据从.getJSON传递到highcharts数据）。相反，我发现this并认为它会更容易将数据传递给模板和javascript函数内部，该函数使用{{var_name}}设置highcharts系列的数据。但是，它不起作用。为什么？您能举例说明如何使用.getJSON设置Highcharts系列的数据或帮助我将变量用作数据的数据源吗？

Answer 1

Jinja2将所有变量作为安全措施进行转义。您显示的字典数组默认呈现为：

[{'f_name': 'Bruce Gradkowski', 'team': 'PIT', 'number': 5, 'position': 'QB', 'y': 99.79, 'x': 185.42}, {'f_name': 'Matthew Stafford', 'team': 'DET', 'number': 9, 'position': 'QB', 'y': 105.23, 'x': 190.5}]

请注意引号如何转换为HTML实体。

要防止转义，您可以按如下方式添加safe过滤器：

{{ var_name|safe }}

请注意，这只能起作用，因为Javascript和Python碰巧有类似的数组和字典语法。