django redirect传递参数_python-django与前端echarts图表传参

一、利用django往前端的web图表传参

因为echarts其核心是利用js的底层技术，所以python-django往前端的echarts传递参数又可以转化成python-django像前端的js传递参数的问题，这里介绍一种很简单的方法。

二、

1、方法核心：通过django往前端传递参数的方法，先在view.py视图函数中写好要传递的参数，如下代码所示：

def index(request):
return render(request, 'FRCAS.html',
{'b':["02A01","02A02","02A03","02A04"],'c':[12, 20, 15, 8]},
)

以下仅展示前端需要的代码：

<script src="static/js/echarts.js"></script>

如下是echarts官网给出的代码示例：

<script type="text/javascript">
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 指定图表的配置项和数据
var option = {
title: {
text: '车型严重故障'
},
tooltip: {},
legend: {
data:['清客'] // data是一定要有的，可以更改
},
xAxis: {
data: {{ b|safe }} // data是一定要有的，可以更改
},
yAxis: {},
series: [{
data: {{ c|safe }}, // data是一定要有的，可以更改
type: 'bar',
showBackground: true,
label: {
normal: {
show: true,
position: 'top'
}
},
backgroundStyle: {
color: 'rgba(220, 220, 220, 0.8)'
}
}]
};
// 使用刚指定的配置项和数据显示图表。myChart.setOption(option);
</script>
</div>

我们要传递的参数是在data中的内容，但是要注意，如果直接写{{b}}，那么js会认为这是不安全的参数传递，启动后在python中会报错。

所以这里必须写成是：{{ b|safe }}必须加上|safe才可以

另外一提，如果前端的内容是一个输入框，

例如:<input type="text" name="a" value={{a}}>这样写是没有问题的，因为django不会对html传参有任何的影响（详见上篇内容）