如何在Node.js项目中引入Python脚本实现Plotly仪表盘?
Node.js项目集成Python生成Plotly仪表盘的可行方案
针对你的需求(通过EJS页面加载Excel并生成Plotly仪表盘),排除Django(与Node.js技术栈冲突、没必要额外引入),下面是两种实用方案:
方案一:Node.js实时调用Python脚本生成仪表盘(协同运行)
这种方案适合需要实时根据Excel数据生成仪表盘的场景,Python负责数据处理和图表生成,Node.js负责接收请求、调用脚本并渲染页面。
步骤1:修改Python脚本
将原脚本改为输出Plotly HTML字符串(而非直接保存文件),方便Node.js捕获结果。创建generate_dashboard.py文件:
import pandas as pd import plotly.offline as pyo import plotly.graph_objs as go import sys def generate_dashboard(excel_path): # 加载Excel数据 df = pd.read_excel(excel_path, sheet_name="datos") # 构建图表 trace0 = go.Bar(x=df["Subcategoria"], y=df["Indicador"], name="Indicador", marker={"color":"#32EC14"}) trace1 = go.Bar(x=df["Subcategoria"], y=df["Valor Encontrado"], name="Valor Encontrado", marker={"color":"#EC1414"}) data = [trace0, trace1] layout = go.Layout( title="Subcategorias (Indicador vs Valor Encontrado)", xaxis=dict(title="Subcategoria"), yaxis=dict(title="Valores Alcanzados") ) fig = go.Figure(data=data, layout=layout) # 返回仅包含图表的HTML片段,依赖CDN加载Plotly.js return pyo.to_html(fig, include_plotlyjs='cdn', full_html=False) if __name__ == "__main__": # 从命令行参数获取Excel文件路径 excel_path = sys.argv[1] print(generate_dashboard(excel_path))
步骤2:Node.js路由处理
在router.js中添加仪表盘路由,使用child_process.execFile调用Python脚本:
const { execFile } = require('child_process'); const express = require('express'); const router = express.Router(); // 仪表盘页面路由 router.get('/dashboard', (req, res) => { // 替换为你的Excel文件实际路径(可改为用户上传路径) const excelPath = './file.xlsx'; execFile('python', ['./generate_dashboard.py', excelPath], (error, stdout, stderr) => { if (error) { console.error('脚本执行失败:', error); return res.status(500).send('仪表盘生成失败'); } if (stderr) { console.error('Python错误输出:', stderr); return res.status(500).send('仪表盘生成失败'); } // 渲染EJS页面,传入生成的图表HTML res.render('dashboard', { dashboardHtml: stdout }); }); }); module.exports = router;
步骤3:创建EJS视图
在views文件夹新建dashboard.ejs,直接嵌入生成的HTML片段:
<!DOCTYPE html> <html lang="es"> <head> <meta charset="UTF-8"> <title>数据仪表盘</title> </head> <body> <h2>Subcategorias对比仪表盘</h2> <!-- 插入Plotly图表HTML --> <%- dashboardHtml %> </body> </html>
方案二:预生成HTML文件,嵌入EJS页面
如果Excel数据更新不频繁,可以先让Python生成静态HTML文件,再通过EJS页面嵌入(适合性能要求较高的场景)。
步骤1:修改Python脚本
将生成的HTML文件保存到public目录(Node.js可直接访问):
import pandas as pd import plotly.offline as pyo import plotly.graph_objs as go # 加载数据 df = pd.read_excel(r'file.xlsx', sheet_name="datos") # 构建图表(和原脚本一致) trace0 = go.Bar(x=df["Subcategoria"], y=df["Indicador"], name="Indicador", marker={"color":"#32EC14"}) trace1 = go.Bar(x=df["Subcategoria"], y=df["Valor Encontrado"], name="Valor Encontrado", marker={"color":"#EC1414"}) data = [trace0, trace1] layout = go.Layout( title="Subcategorias (Indicador vs Valor Encontrado)", xaxis=dict(title="Subcategoria"), yaxis=dict(title="Valores Alcanzados") ) fig = go.Figure(data=data, layout=layout) # 保存到public目录下的dashboards文件夹(需先创建该文件夹) pyo.plot(fig, filename="./public/dashboards/Dashboard.html", include_plotlyjs='cdn')
步骤2:Node.js路由与EJS渲染
在router.js中添加路由,生成文件后通过iframe嵌入EJS:
const { execFile } = require('child_process'); const express = require('express'); const router = express.Router(); router.get('/dashboard', (req, res) => { execFile('python', ['./generate_dashboard.py'], (error, stdout, stderr) => { if (error) { console.error('生成失败:', error); return res.status(500).send('仪表盘生成失败'); } // 渲染EJS,传入静态HTML的访问路径 res.render('dashboard', { dashboardUrl: '/dashboards/Dashboard.html' }); }); }); module.exports = router;
对应的dashboard.ejs:
<!DOCTYPE html> <html lang="es"> <head> <meta charset="UTF-8"> <title>数据仪表盘</title> </head> <body> <h2>Subcategorias对比仪表盘</h2> <iframe src="<%= dashboardUrl %>" width="100%" height="800px" frameborder="0"></iframe> </body> </html>
必要准备工作
- 服务器需安装Python 3.x,以及依赖库:
pip install pandas plotly openpyxl(openpyxl用于读取Excel文件) - Windows环境下,若
python命令无效,需替换为python.exe或配置Python环境变量 - 若需要用户上传Excel文件,可使用
multer模块实现文件上传功能,再将上传后的文件路径传给Python脚本
内容的提问来源于stack exchange,提问作者Sofia Blanco Sanchez
相关产品推荐
相关产品推荐

