大数据-数据可视化-环境部署vue+echarts+显示案例

文章目录

    • 一、安装node.js
      • 1 打开火狐浏览器,下载Node.js
      • 2 进行解压
      • 3 配置环境变量
      • 4 配置生效
    • 二、安装vue脚手架
      • 1 下载vue脚手架,耐心等待。
    • 三、创建vue项目并启动
      • 1 创建
      • 2 启动
    • 四、下载echarts.js与axios.js到本地。
    • 五、图表显示demo

【以下所有操作均在centos上进行】

一、安装node.js

1 打开火狐浏览器,下载Node.js

在node.js中选择需要的版本下载,本人下载v16.60,下载网址https://nodejs.org/download/release/v16.20.2/
在这里插入图片描述

2 进行解压

在这里插入图片描述
查看解压内容:
在这里插入图片描述

3 配置环境变量

切换到root角色

su root
vi /etc/profile

添加安装路径

export PATH=$PATH:【Node.js中bin的路径】(如下图)

在这里插入图片描述

4 配置生效

source /etc/profile

二、安装vue脚手架

1 下载vue脚手架,耐心等待。

在这里插入图片描述
安装完成时显示如下:
在这里插入图片描述

安装时遇到错误 sill idealTree buildDeps:
在这里插入图片描述
解决方案:更换镜像源

npm config set registry http://registry.npm.taobao.org/

三、创建vue项目并启动

1 创建

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/405619.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

详解编译和链接!

目录 1. 翻译环境和运行环境 2. 翻译环境 2.1 预处理 2.2 编译 2.3 汇编 2.4 链接 3. 运行环境 4.完结散花 悟已往之不谏,知来者犹可追 创作不易,宝子们!如果这篇文章对你们…

老杨说运维 | 运维大数据价值探索

文末附有视频 伴随第六届双态IT乌镇用户大会的圆满完成,擎创科技“一体化数智管理和大模型应用”主题研讨会也正式落下了帷幕。 云原生转型正成为很多行业未来发展战略,伴随国家对信创数字化要求的深入推进,面对敏稳共存这一近年出现的新难…

HTTP概要

文章目录 什么是HTTP?URL的结构请求报文结构请求方法GETHEADPOSTPUTDELETETRACEOPTIONSCONNECTPATCH解释 请求头字段 响应报文结构响应状态响应头字段 HTTP会话3次握手无状态协议 什么是HTTP? HTTP,即Hypertext Transfer Protocol(超文本传输协议) 它是一个”请…

PostMan使用自带js库base64编码、sha256摘要、环境变量的使用

目录 1、环境变量的使用2、base64编码、sha256摘要、以及脚本的使用3、脚本代码 在请求调试接口的过程中,因为要使用大量相同的参数,使用变量的方式能很大程度上减轻接口调用的工作量 版本说明:Postman for Windows,Version&#…

ant-design-charts 对带缩略轴柱状图 根据数据自定义列处理, 以颜色为例

摘要 本文主要对ant-design-charts中带缩略柱状图进行自定义列处理 ant-design-charts版本:1.4.2 1、定义数据 const data1 [{"a": "七台河","b": 52827.32,c: 2},{"a": "万县","b": 20000,c: 1},…

【Java EE初阶二十四】servlet的深入理解

1. Servlet API 的学习 下面主要学习这三个类,就已经可以完成 Servlet 的大部分开发了; 1. Httpservlet 2. HttpServletRequest 3. HttpServletResponse 2. Httpservlet的学习 2.1 Httpservlet在tomcat的工作原理 写一个 Servlet 代码,往往都…

【达梦数据库】数据库的方言问题导致的启动失败

问题场景 在项目中采用了hibernate ,连接数据库原本为ORACLE,后续打算改造为国产数据库 达梦 链接配置: # 达梦写法, index:driver-class-name: dm.jdbc.driver.DmDriverjdbc-url: jdbc:dm://192.168.220.225:5236/IDX4username:…

回归预测 | Matlab实现PSO-BiLSTM-Attention粒子群算法优化双向长短期记忆神经网络融合注意力机制多变量回归预测

回归预测 | Matlab实现PSO-BiLSTM-Attention粒子群算法优化双向长短期记忆神经网络融合注意力机制多变量回归预测 目录 回归预测 | Matlab实现PSO-BiLSTM-Attention粒子群算法优化双向长短期记忆神经网络融合注意力机制多变量回归预测预测效果基本描述程序设计参考资料 预测效果…

YOLOv5改进 | Conv篇 | 利用YOLOv9的GELAN模块替换C3结构(附轻量化版本 + 高效涨点版本 + 结构图)

一、本文介绍 本文给大家带来的改进机制是利用2024/02/21号最新发布的YOLOv9其中提出的GELAN模块来改进YOLOv5中的C3,GELAN融合了CSPNet和ELAN机制同时其中利用到了RepConv在获取更多有效特征的同时在推理时专用单分支结构从而不影响推理速度,同时本文的内容提供了两种版本一…

安全生产:AI视频智能分析网关V4如何应用在企业安全生产场景中?

随着科技的不断进步,视频智能分析技术在安全生产领域中的应用越来越广泛。这种技术通过计算机视觉和人工智能算法,可以对监控视频进行自动分析和处理,以实现多种功能,如目标检测、行为识别、异常预警等。今天我们以TSINGSEE青犀AI…

【服务器数据恢复】通过reed-solomon算法恢复raid6数据的案例

服务器数据恢复环境: 一台网站服务器中有一组由6块磁盘组建的RAID6磁盘阵列,操作系统层面运行MySQL数据库和存放一些其他类型文件。 服务器故障: 该服务器在工作过程中,raid6磁盘阵列中有两块磁盘先后离线,不知道是管理…

216972-99-5,Texas Red-X NHS ester,mixed isomers,生物标记反应中常用的试剂

您好,欢迎来到新研之家 文章关键词:216972-99-5,Texas Red-X NHS ester,mixed isomers,德州红-X 活化酯 一、基本信息 【产品简介】:The excitation peak of Texas Red is located at 589 nanometers, which allows…

《TCP/IP详解 卷一》第4章 地址解析协议ARP

目录 4.1 引言 4.2 一个例子 4.3 ARP缓存 4.4 ARP帧格式 4.5 ARP例子 4.6 ARP缓存超时 4.7 代理ARP 4.8 免费ARP和地址冲突检测 4.9 ARP命令 4.10 使用ARP设置嵌入式设备IPv4地址 4.11 与ARP相关攻击 4.12 总结 4.1 引言 地址解析: IPv4:AR…

Linux的ACL权限以及特殊位和隐藏属性

前言: ACL是什么? ACL(Access Control List)是一种权限控制机制,用于在Linux系统中对文件和目录进行细粒度的访问控制。传统的Linux权限控制机制基于所有者、所属组和其他用户的三个权限类别(读、写、执行…

Intel处理器虚拟化技术VT-x86下实现小型虚拟化框架(1)

一.前言 我一直觉得,学习计算机中的一门新技术,一定要从历史去了解他的全貌。这样有利于我们了解事情的来龙去脉和发展的过程。一上来直接接触新兴事物,很容易陷入不知从何下手的困境。不了解历史发展,就不明白前人的一些操作。因…

【无刷电机学习】各种电机优势比较

目录 0 参考出处 1 有刷与无刷比较 2 交流与直流比较 3 内转子与外转子比较 4 Delta型与Y型定子绕向比较 5 低压BLDC的一些优点 0 参考出处 【仅作自学记录,不出于任何商业目的。如有侵权,请联系删除,谢谢!】 维基百科…

2024 CKS 题库 | 11、AppArmor

不等更新题库 CKS 题库 11、AppArmor Context: APPArmor 已在 cluster 的工作节点node02上被启用。一个 APPArmor 配置文件已存在,但尚未被实施。 Task: 在 cluster 的工作节点node02上,实施位于 /etc/apparmor.d/nginx_apparmor 的现有APPArmor 配置…

opencv判断二值的情况

目的 先说说理论: 什么叫图像的二值化?二值化就是让图像的像素点矩阵中的每个像素点的灰度值为0(黑色)或者255(白色),也就是让整个图像呈现只有黑和白的效果。在灰度化的图像中灰度值的范围为0…

HTML 面试题汇总

HTML 面试题汇总 1. 什么是 <!DOCTYPE>&#xff1f;是否需要在 HTML5 中使用&#xff1f; 参考答案&#xff1a; 它是 HTML 的文档声明&#xff0c;通过它告诉浏览器&#xff0c;使用哪一个 HTML 版本标准解析文档。 在浏览器发展的历史中&#xff0c;HTML 出现过很多个版…

STM32控制max30102读取血氧心率数据(keil5工程)

一、前言 MAX30102是一款由Maxim Integrated推出的低功耗、高精度的心率和血氧饱和度检测传感器模块&#xff0c;适用于可穿戴设备如智能手环、智能手表等健康管理类电子产品。 该传感器主要特性如下&#xff1a; &#xff08;1&#xff09;光学测量&#xff1a;MAX30102内置…