省份信息大数据可视化

项目名称:省份大数据可视化

项目概述:

通过使用Echarts数据可视化库,将庞大的数据集以图表的方式展示,帮助用户更好地理解和分析数据。做这个项目仅仅是做一个练手小Demo。

技术栈:

  • 前端框架:vue.js

  • 后端框架:express

  • 数据可视化库:Echarts

  • 响应式布局:rem

遇到的挑战:

小型Demo,并未遇到主要挑战与困难

收获与成就:

在项目开发过程中,我学习并应用了rem作为我的响应式布局技术,rem是相对于根元素(html)字体大小的单位,它的值可以根据元素的字体大小而相对的调整,从而实现页面的自适应布局。由于大数据图表是宽屏项目,所以在项目中我主要修改了rem配置文件的默认分辨率

总结:

在完成这个大数据图表的过程中,我不仅成功运用了Echarts库来可视化数据,还学习到了rem响应式布局,通过rem响应式布局我能根据不同设备的屏幕尺寸和分辨率来自动调整图表大小和布局。这大大提高了项目的用户体验并使图表在不同设备都能良好地展示。

项目链接:

省份信息大数据可视化

后端启动方式 进入到hexo目录中的server文件夹pm2 start index.js来启动

番外:

pm2是什么:

PM2是 node 进程管理工具

pm2优点

  • 后台运行(关掉cmd窗口依然运行)
  • 0 秒停机重载,维护升级时不需要停机
  • 进程守护 (停止不稳定的进程,避免无限循环)
  • 实时控制台检测
  • 远程控制和实时的接口API ( nodejs 模块,允许和PM2进程管理器交互 )
  • 不仅仅可以启动node程序,对于一般的脚本程序同样可以

安装pm2:

npm install -g pm2

pm2的使用:

pm2 start index.js(找到后台监听端口的文件)

参数说明:

  • --watch:监听应用目录的变化,一旦发生变化,自动重启。如果要精确监听、不见听的目录,最好通过配置文件。
  • -i --instances:启用多少个实例,可用于负载均衡。如果-i 0或者-i max,则根据当前机器核数确定实例数目。
  • -n --name:指定应用的名称。查看应用信息的时候可以用到。
  • -o --output <path>:标准输出日志文件的路径。
  • -e --error <path>:错误输出日志文件的路径。

例子:

  • pm2 start app.js --watch:实时监控的方式启动,app.js文件有变动时,pm2会自动reload(重启)
  • pm2 start app.js -i max:根据有效CPU数目启动最大进程数目
  • pm2 start app.js -i 3:启动3个进程
  • pm2 start app.js -i max - -z 10:在 – 之后给 app.js 传递参数(-z 10)

查看与监视进程

  • pm2 list:显示所有进程信息;
  • pm2 show 11pm2 info 11:查看进程id为 11 的详细信息;
  • pm2 monit:进入监视页面,监视每个node进程的CPU和内存的使用情况。

重载、重启

  • pm2 restart 11:重启id为 11 的进程;
  • pm2 restart all:重启所有进程;
  • pm2 reload 11:0秒停机重载id为 11 进程(用于 NETWORKED 进程);
  • pm2 reload all:重载所有进程;

停止、删除进程

  • pm2 stop/delete 11:停止/删除id为 11 的进程;
  • pm2 stop/delete all:停止/删除所有进程;

日志操作

  • pm2 logs:显示所有进程的日志;
  • pm2 logs 11:显示进程id为 11 的日志;
  • pm2 flush:清空所有日志文件;
  • pm2 startup:产生 init 脚本,保持进程活着;

杀进程

  • pm2 kill:杀死pm2进程 ;

开机自动启动

  • 保存当前进程状态
    pm2 save

  • 生成开机自启动服务
    pm2 startup

  • 启用开机自启:
    systemctl enable pm2-root


欢迎指出任何有错误或不够清晰的表达。可以在下面评论区评论,也可以邮件至 1701220998@qq.com
导航页 GitHub