ChartJS 不显示 Jinja 变量提供的标签

斯文·滕舍

我想使用 Flask 来呈现 ChartJS 图形。这是来自我的 routes.py

@app.route("/graph")
def graph():
    d = Eval.query.all()
    labels = [i.date.strftime('%d.%m.%Y') for i in d]
    data = [i.bw for i in d]
    return render_template('chart.html', title='Charts', labels = labels, data = data) 

我在chart.html中有以下代码:

{% extends "base.html" %}
{% block content %}

<canvas id="myChart" height="400" width="800"></canvas>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script>

<script type="text/javascript">
var ctx = document.getElementById('myChart').getContext('2d');
var chart = new Chart(ctx, {
  type: 'line',
  data: {
  labels: ['16.07.2017', '23.07.2017', '30.07.2017', '06.08.2017', '13.08.2017'],
  datasets: [{
      label: "My First dataset",
      backgroundColor: 'rgb(255, 99, 132)',
      borderColor: 'rgb(255, 99, 132)',
      data: {{ data }} 
   }]
  },
  options: {
    responsive:false
   }
});
</script>

{% endblock %}

使用此代码,图表以正确的标签呈现。

问题:

但是,一旦我将标签更改为

 labels: {{ labels }}

图表根本没有呈现。

我检查以确保 {{ labels }} 表达式确实也是具有正确格式的列表。在脚本标签上方调用 {{ labels }} 会在 html 页面中显示以下输出:

['16.07.2017', '23.07.2017', '30.07.2017', '06.08.2017', '13.08.2017']
亚历克斯

如果您不使用safe过滤器,特殊符号将在模板解析过程中被转义,并会破坏变量值。

在上述情况下,没有 'jinja safe' 过滤器的最终变量值将是

["16.07.2017", "23.07.2017"] =>[&#39;16.07.2017&#39;,&#39;23.07.2017&#39;]

并且该值 ( [&#39;16.07.2017&#39;,&#39;23.07.2017&#39;]) 对于 JS 是非法的,您将能够在浏览器控制台中看到错误:

Uncaught SyntaxError: Unexpected token &

在上述情况下,带有“jinja safe”过滤器的最终变量值将相同

["16.07.2017", "23.07.2017"] =>["16.07.2017", "23.07.2017"]

您可以在此处阅读有关转义的更多信息

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

ChartJS:如何显示标签,图例,标题?

来自分类Dev

带有AngularJS的ChartJS-画布将不显示任何内容

来自分类Dev

滑动菜单不显示标签

来自分类Dev

TableView不显示标签iOS

来自分类Dev

Tabhost不显示标签

来自分类Dev

确认标签不显示

来自分类Dev

Chartjs-不显示小数值的甜甜圈图表标签

来自分类Dev

标签页不显示

来自分类Dev

Chartjs显示标签但不打勾

来自分类Dev

ChartJS画布在IE,Safari和Firefox中不显示RGBA颜色

来自分类Dev

Gedit不显示某些标签

来自分类Dev

ggplot boxplot标签不显示

来自分类Dev

chartjs-plugin-error-bars在水平条形图上显示错误栏而不显示标签

来自分类Dev

图像标签不显示图像

来自分类Dev

Gedit不显示某些标签

来自分类Dev

选项标签不显示

来自分类Dev

<div>变量不显示

来自分类Dev

为什么在标签上的功能中不显示变量?

来自分类Dev

在工具提示中显示标签,但在ChartJS折线图的x轴中不显示

来自分类Dev

TableView不显示标签iOS

来自分类Dev

Tabhost不显示标签

来自分类Dev

标签页不显示

来自分类Dev

全局分配的变量不显示

来自分类Dev

图表标签未在chartjs中显示

来自分类Dev

img标签不显示图像

来自分类Dev

ChartJS 散点图 X 轴标签未正确显示

来自分类Dev

jqplot 不显示标签端点

来自分类Dev

标签内容不显示

来自分类Dev

ChartJS:自定义图例不显示多饼图的标签