初探vue+nodejs+echarts展示图表

最新推荐文章于 2024-05-06 14:53:24 发布

原创

最新推荐文章于 2024-05-06 14:53:24 发布 · 1.8k 阅读

27 ·

CC 4.0 BY-SA版权

文章标签：

#vue #nodejs

本文档介绍了如何结合Vue.js、Node.js和ECharts库创建一个图表展示应用。首先，展示了在node服务端(server.js)设置接口获取数据的步骤，接着讨论了如何从MySQL数据库获取数据。然后，讲解了在前端页面中编写代码以连接并利用这些接口展示图表的过程。最后，附带了应用的实际效果图。

初探nodejs+echarts展示图表

node服务端server.js
mysql 数据
运行node服务测试接口
前端页面代码
效果图

node服务端server.js

var express = require('express')

var app = express()

var fs = require('fs')

var mysql = require('mysql')

var cors = require('cors')

// 设置跨域访问
app.all('*', function (req, res, next) {
   
   
  res.header('Access-Control-Allow-Origin', '*')
  res.header('Access-Control-Allow-Headers', 'X-Requested-With')
  res.header('Access-Control-Allow-Methods', 'PUT,PO