Javascript Nodejs Plotlyjs单独工作，但不能一起工作
这个问题似乎有两个部分。。第1部分已经解决，但我会留给未来的人 第1部分 因此，我试图将数据从我的微控制器传输到一个带有实时图形的网站 我从一个简单的index.html页面开始，使用plotlyjs创建一个使用随机数的实时图形——它起作用了 于是，我创建了一个index.js文件，并开始编写代码以流式传输数据，我使用了nodejs express socketio，并在localhost 3000上获得了控制台上实时显示的数据 因此，我将我的nodejs index.js页面链接到我的index.html页面，现在我可以看到标题，但我再也看不到图表了 如果我不使用index.js直接查看html页面，我可以看到带有随机数的图表，但如果使用真实的流数据index.js文件查看，我只能看到标题 我不知道为什么会这样 index.html文件代码Javascript Nodejs Plotlyjs单独工作，但不能一起工作,javascript,node.js,express,socket.io,plotly.js,Javascript,Node.js,Express,Socket.io,Plotly.js,这个问题似乎有两个部分。。第1部分已经解决，但我会留给未来的人 第1部分 因此，我试图将数据从我的微控制器传输到一个带有实时图形的网站 我从一个简单的index.html页面开始，使用plotlyjs创建一个使用随机数的实时图形——它起作用了 于是，我创建了一个index.js文件，并开始编写代码以流式传输数据，我使用了nodejs express socketio，并在localhost 3000上获得了控制台上实时显示的数据 因此，我将我的nodejs index.js页面链接到我的inde
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="plotly.min.js"></script>
<script src="/socket.io/socket.io.js"></script>
<meta charset="utf-8" />
<title>My Plot Page</title>
</head>
<body>
<p>Plotly plot:</p>
<div id="chart1"></div>
<script>
const socket = io();
var counter = 0;
function getX() {
counter++;
return counter;
}
function getY() {
socket.on('msp432 : data', function (data) {
return data.value;
})
return 0;
}
Plotly.plot('chart1', [{
x: [],
y: [],
type: 'line'
}]);
setInterval(function () {
Plotly.extendTraces('chart1', { x: [[getX()]] , y: [[getY()]] }, [0])
}, 500);
</script>
</body>
</html>
function getY() {
socket.on('msp432 : data', function (data) {
return data.value;
})
return 0;
}
const express = require('express');
const socketIO = require('socket.io');
const http = require('http');
const app = express();
const server = http.createServer(app);
const io = socketIO.listen(server);
io.on('connection', function (socket) {
console.log('a new socket connection');
});
app.get('/', (req, res, next) => {
res.sendFile(__dirname + '/index.html');
});
const SerialPort = require('serialport');
const myPort = new SerialPort('COM5', {
baudRate: 9600
})
myPort.on('open', function () {
console.log("opened the port")
})
myPort.on('data', function (data) {
console.log('Data:', data.toString());
io.emit('msp432 : data', {
value: data.toString()
});
});
server.listen(3000, () => {
console.log("server on port ", 3000);
})
尝试从他们的CDN加载它：
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
这起作用了，我现在看到我的图表了。但看起来我还有其他问题，因为我现在看到的都是0。。。getY（）函数似乎不接收数据，只输出0，从不进入套接字代码..好的，我现在尝试一下您是否将
plotly.min.jspublicpublicapp.use（express.static（path.join（u dirname，'public'））src=“/filename”<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
let yVal = 0;
socket.on('msp432 : data', function (data) {
yVal = data.value;
})
function getY() {
return yVal;
}