Flask从MongoDB获取数据
1.导入pymongo库。
PyMongo is a
Python distributioncontaining tools for working withMongoDB, and is the recommended way to work with MongoDB from Python.
import pymongo
2.创建数据类初始化方法，指定默认url和数据库。
class Model:
def __init__(self,url="",database=""):
self.url=url
self.database=database
if self.url=="":
self.url="mongodb://localhost:27017/"
if self.database=="":
self.database="Data_visual"
self.myclient=pymongo.MongoClient(self.url)
self.mydb=self.myclient[self.database]
3.创建取数据方法，在指定的集合中查询所有数据，并以列表形式返回。在返回前先把每个元素的_id去掉。
def get_behavior_count(self):
mycol=self.mydb["behavior_count"]
data=mycol.find()
res=[]#直接list(data)不行
for x in data:
x.pop("_id")
res.append(x)
return res
data的数据形式：
去掉id后：
从Flask传json数据到ECharts
1.用ECharts画图
（1）在html头部引入：
<script src="echarts.min.js"></script>
（2）在html中准备一个画图的容器
<body>
<!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
<div id="main" style="width: 600px;height:400px;"></div>
</body>
（3）在js代码中进行画图
// 【1】基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 【2】指定图表的配置项和数据
var option = {
series: [{
name: '销量',
type: 'bar',
data: [5, 20, 36, 10, 10, 20]
}]
};
// 【3】使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
2.从flask传数据到js代码中
（1）在flask中传数据到html中是通过jinja，传到js中也是一样。那就是通过render_template函数传递参数。
from flask import render_template
from . import item
from ..models import Model
@item.route('/', methods=['GET'])
def index():
model=Model()
data=model.get_behavior_count()
return render_template('item.html',data=data)
（2）js 代码内嵌于html，js中调用参数，代码如下：
<script type="text/javascript">
var my_data= {{ data|tojson }}
console.log(my_data)
</script>
返回结果：
（3）js 作为外部文件被html引用，js中调用参数，代码如下：
A.在引入的js文件下面添加：
<script src="js/test.js" type="text/javascript"></script>
<script type="text/javascript">
var Server = {
my_data:{{ data|tojson }}
};
</script>
B.在被引入的js文件中添加：
var target_data= Server.my_data
//在echarts图标的配置项中设置data
var option = {
series: [{
name: '销量',
type: 'bar',
data: target_data
}]
};
这样就可以把数据库的数据绘制出来啦。修改数据库的数据，页面也会直接更新。
PS:
- 从 jinja官方文档对tojson的解释来看，过滤器tojson可以返回json格式的字符串。
- 从结果上看，jinja好像只可以把数据传到html的js中，想在另外的文件引用要通过js自己的变量来传递了。
参考：
