我想创建一个折线图，其中有两行显示两个不同的数据。下面显示的是我想要实现的示例图
样本图
下面显示的是我存储在MongoDB中的当前集合。手推车1收集
小车2收集
下面的代码是我创建的flask应用程序，"/"路由用于显示页面，"/data"路由是图表检索数据的位置。
from flask import Flask, render_template, jsonify
import pymongo
from flask_pymongo import PyMongo
app = Flask(__name__)
app.config["MONGO_URI"] = "mongodb://localhost:27017/mydb"
mongo = PyMongo(app)
client = pymongo.MongoClient('localhost',27017)
db = client['mydb']
@app.route("/")
def home():
return render_template('SmartTrolley.html')
@app.route("/data")
def data():
line1 = db.trolley1
line2 = db.trolley2
results1 = line1.find()
results2 = line2.find()
return jsonify({'results': results1["temperature"]}), jsonify({'results': results2["temperature"]})
if __name__=='__main__':
app.debug = True
app.run(port=5000)
下面的代码是我的html，我的图表在这里编码。
<!DOCTYPE html>
<html>
<link rel="stylesheet" href="../static/SmartTrolley.css">
<script src="https://cdn.jsdelivr.net/npm/chart.js@2.9.3/dist/Chart.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<div class="graph">
<canvas id="chart"></canvas>
<script>
var ctx = document.getElementById('chart').getContext('2d')
var getData = $.get('/data');
getData.done(function(results) {
var myChart = new Chart(ctx, {
type: 'line',
data: {
labels: ['Tue 11','3am', '6am', '9am', '12pm', '3pm', '6pm', '9pm', 'Wed 12'],
datasets: [{
label: "trolley1",
fill: false,
data: results.results,
borderWidth: 1,
borderColor: 'black',
}, {
label: "trolley2",
fill: false,
data: results.results,
borderWidth: 1,
borderColor: 'red',
}]
},
options: {
legend: {
position: 'top',
align: 'start'
},
title: {
display: 'true',
fontSize: 15,
text: 'Temperature recordings'
},
scales: {
yAxes: [{
ticks: {
max: 30,
min: 12,
beginAtZero: false,
}
}]
}
}
});
})
</script>
</div>
然而，当我运行烧瓶应用程序时，'/data'路由显示错误"；TypeError：索引"temperature"不能应用于Cursor实例；。此外，该图根本没有显示任何内容，包括x轴和y轴的标签。有人能帮忙吗，我真的很感激。谢谢！
find()返回一个光标。如果您希望得到一条记录，则应使用：
results1 = line1.find_one()
results2 = line2.find_one()