出于学习目的,在Gitee上寻找项目并尝试上手,将开源项目部署在阿里云服务器上,结合现有数据进行实际演练。
项目选取
GVP-Gitee最有价值开源项目目前收录了327个项目,此次选取了与数据库相关的15个GVP项目中的DataGear数据分析可视化平台官网,Star2.2K,Fork800+
项目概述
DataGear是一款开源免费的数据可视化分析平台,使用Java语言开发,采用浏览器/服务器架构,支持SQL、CSV、Excel、HTTP接口、JSON等多种数据源,主要功能包括数据管理、SQL工作台、数据导入/导出、数据集管理、图表管理、看板管理等。
系统特点:
- 支持接入多种数据源
支持接入任意提供JDBC驱动的数据库,包括MySQL、Oracle、PostgreSQL、SQL Server等关系数据库,以及Elasticsearch、ClickHouse、Hive等大数据引擎。 - 支持多种格式的数据集
支持创建SQL、CSV、Excel、HTTP接口、JSON数据集,可将数据集定义为动态参数化数据集,可添加文本框、下拉框、日期框、时间框等类型的数据集参数,为构建动态可交互图表提供支持。 - 丰富强大的图表功能
图表可聚合多个不同格式的数据集,内置折线图、柱状图、饼图、地图、雷达图、漏斗图等开箱即用的图表,并且支持自定义图表配置项,支持编写和上传自定义图表插件。 - 可自由编辑的数据可视化页面
可视化页面采用原生的HTML网页作为模板,可自由编辑页面内容,支持导入任意HTML网页,为元素添加扩展属性即可绑定和配置图表,页面内置丰富的API,可构建图表联动、数据钻取、异步加载、交互表单等个性化的数据可视化页面。
安装与开始
- 安装JRE运行环境
DataGear需要JRE1.8及以上版本的运行环境
JRE安装步骤如下所示:
a) 点击这里打开官方下载网页;
b) 点击DOWNLOAD下载链接,进入下载网页;
c) 选中Accept License Agreement,然后选择适合您操作系统的版本,点击链接开始下载;
d) 按照JRE安装包的要求完成安装。
如果您已安装过JRE,可以忽略此步骤。 - 从官网首页下载最新版软件包
官网首页地址: http://www.datagear.tech - 解压软件包
解压后,将产生一个名为datagear-[version]的文件夹 - 启动服务
Linux:执行datagear-[version]/startup.sh
Windows:执行datagear-[version]/startup.bat - 开始使用
打开浏览器,在地址栏中输入:
http://[DataGear服务地址]:50401
例如:http://localhost:50401、http://192.168.1.1:50401
- 系统初始会内置一个管理员账号,账号名为:admin,初始密码为:admin
- 系统的所有数据都存储在[用户主目录]/.datagear文件夹内,请在必要时做好此文件夹的备份工作。
- 系统数据库使用了内置Derby数据库,存储在[用户主目录]/.datagear/derby文件夹内。
- ……
实战过程
Linux卸载已有jdk
官网说明
Java 卸载有两种方法卸载 Java。请使用您在安装 Java 时所用的方法。例如,如果您以前使用 RPM 安装 Java,则使用 RPM 卸载方法。
- RPM 卸载注:如果您的 Linux 盒中具有 RPM,则应首先确定 Java 是否是使用 RPM 安装的。如果 Java 不是使用 RPM 安装的,则请跳过本节内容。
- 打开终端窗口
- 以超级用户身份登录
- 键入以下命令,尝试查找 JRE 软件包:
rpm -qa
- 如果 RPM 报告一个类似于 jre–fcs 的软件包,则说明 Java 是使用 RPM 安装的。
注:通常,您不必使用 RPM 卸载 Java,因为 RPM 可以在安装新版本时自动卸载旧版本的 Java!除非您准备永久删除 Java,否则请跳过本节内容。 - 要卸载 Java,请键入:
rpm -e jre--fcs
- 自解压文件卸载
- 确定 Java 是否安装在某些文件夹中。常用位置包括
/usr/java/jre_
或/opt/jre_nb/jre_/bin/java/
- 如果找到了安装 Java 的文件夹,可以删除此文件夹。
警告:删除文件夹之前,应确保 Java 以前不是使用 RPM 安装的。 - 键入:
rm -r jre
例如:rm -r jre1.7.0
- 确定 Java 是否安装在某些文件夹中。常用位置包括
实际操作



解压jdk包
cd /usr/local/
mkdir ./java
cd /home/software/
tar -zxvf jdk-8u281-linux-x64.tar.gz -C /usr/local/java/
配置profile文件内JAVA_HOME路径
vim /etc/profile
Shift + g 跳转到末行
i 进行编辑
在末行后输入
export JAVA_HOME=/usr/local/java/jdk1.8.0_281
export JRE_HOME=${JAVA_HOME}/jre
export CLASSPATH=.:${JAVA_HOME}/lib:${JRE_HOME}/lib
export PATH=${JAVA_HOME}/bin:$PATH
ESC退出编辑模式
:wq 保存并退出
source /etc/profile

MySQL环境配置
由于本人只有一台服务器,服务器里的数据库还有网站数据,不方便全部干掉重新配置,本人直接记录使用及之后的操作。参考各种CSDN、简书、google上的教程即可:
MySQL安装配置 菜鸟教程
Linux下安装mysql-5.7.24
DataGear安装与使用
- 从官网首页下载最新版软件包,官网首页地址: http://www.datagear.tech
- 使用xftp上传到Linux服务器中并解压
- 提高sh脚本权限

- 执行datagear-[version]/startup.sh


- 云服务器需要现在云服务器控制台的安全组规则配置中打开TCP:50401端口
- 粗暴地关闭防火墙
- service firewalld status #查看防火墙状态
- systemctl stop firewalld.service #关闭防火墙
- systemctl start firewalld.service #开启防火墙
- systemctl disable firewalld.service #关闭防火墙开机自启动
- systemctl enable firewalld.service #开启防火墙开机自启动
- 打开浏览器,在地址栏中输入:
- http://[DataGear服务地址]:50401
数据源管理
添加驱动程序
DataGear使用JDBC驱动程序连接数据库,在使用之前,您需要到数据库官网下载相应的JDBC驱动程序(*.jar文件),然后在系统的管理驱动程序页面添加即可。 具体添加步骤如下所示:
- 以管理员身份登录系统(账号为:admin,初始密码为:admin)
- 点击主页右上角的【⚙】按钮;
- 点击弹出菜单中的添加驱动程序条目,添加下载的JDBC驱动程序即可。
注意:上传驱动程序时,要将其依赖库一并上传。系统已自带了MySQL、Oracle、PostgreSQL、SQL Server部分版本数据库的驱动程序,您可以在管理驱动程序页面查看它们是否支持您的数据库。
添加数据源
- 点击主页左上角数据源栏下的【+】按钮
- 输入数据源信息
数据源URL
数据源的JDBC连接URL,每类数据源都有各自规范的格式。
您可以点击后面的【?】图标打开帮助页面辅助设置。
如果帮助页面没有您的数据源类型,您需要先到数据库官方网站查找对应的JDBC连接URL格式。
高级设置
用于明确设定数据源驱动程序。
建议您不要设置此项,系统会自动选定最合适的数据源驱动程序。 - 保存
保存后,您可以通过【+】右侧的【▼】菜单对其进行编辑。
数据可视化分析
导入看板
选用Gitee开源项目模板:大屏数据展示模板
在看板管理界面点击[导入]按钮,即可将任意HTML导入为看板模板。 导入文件可以是单个HTML文件,也可以是包含HTML文件及其依赖所有资源的ZIP压缩包。例如:index.html或者my-dashboard.zip
|--index.html |--conent.html |--style |--dashboard.css |--images |--bg.png |--icon.png |--script |--dashboard.js
注意:导入ZIP压缩包前,确保看板文件、文件夹都直接位于压缩包根目录下,不要再内嵌一级目录。
具体操作
1、将Gitee开源项目下载到本地

2、任意选择一个智慧**大屏,这里选择智慧交通——高速交通大数据分析平台,修改index.html文件
项目结构:
```
高速交通大数据分析平台
├─ css
│ ├─ swiper.min.css
│ └─ visual.css
├─ fonts
│ └─ yjsz.TTF
├─ images
│ ├─ data08.png
│ ├─ jcdsj_logo.gif
│ ├─ jcdsj_logo.png
│ ├─ jzxz1.png
│ ├─ jzxz2.png
│ ├─ ksh31.png
│ ├─ ksh32.png
│ ├─ ksh33.png
│ ├─ ksh34.png
│ ├─ ksh35.png
│ ├─ ksh36.png
│ ├─ ksh37.png
│ ├─ ksh38.png
│ ├─ ksh39.png
│ ├─ ksh40.png
│ ├─ ksh41.png
│ ├─ ksh42.png
│ ├─ ksh43.png
│ ├─ ksh44.png
│ └─ ksh45.png
├─ index.html
├─ js
│ ├─ bootstrap.min.js
│ ├─ chartMap.js
│ ├─ china.js
│ ├─ echarts.min.js
│ ├─ jquery.leoweather.min.js
│ ├─ jquery.min.js
│ ├─ mapcodes.js
│ ├─ npm.js
│ ├─ swiper.min.js
│ └─ visual.js
└─ 高速综合管控大数据平台.png
```

在index.html文件第216行之后查看该部分,注释掉绿色部分
(展示时文字与收费站收费量img src="images/ksh33.png"
重叠冲突)
<div class="visual_box visualSfzsfl">
<div class="visual_title">
<span>收费站收费量</span>
<img src="images/ksh33.png">
</div>
<div class="visual_chart" id="main9">
</div>
<!--
<div class="visual_table">
<table>
<tr>
<td>小型车</td>
<td>中型车</td>
<td>大型车</td>
</tr>
<tr>
<td>2486万</td>
<td>2486万</td>
<td>2486万</td>
</tr>
<tr>
<td>2486万</td>
<td>2486万</td>
<td>2486万</td>
</tr>
<tr>
<td>2486万</td>
<td>2486万</td>
<td>2486万</td>
</tr>
<tr>
<td>2486万</td>
<td>2486万</td>
<td>2486万</td>
</tr>
</table>
</div>
-->
</div>
3、对文件进行打包、导入上传

4、导入上传、保存


5、展示

效果演示

TIPS
- 展示界面最上方的:晋城高速综合管控大数据是通过images文件夹下的jcdsj_logo.gif和jcdsj_logo.png显示的,可以通过修改gif图片去更改页面顶部显示的内容。

- 所有更改都需要在本地修改后,重新打包、导入上传、保存展示
结合真实数据
导入数据
方法一、使用Navicat图形化界面导入:
报错解决
- 连接MySQL数据库报错1130原因有二:
1、mysql数据库中的user的表中没有权限(也可以说没有用户)
2、防火墙3306(mysql)端口没有打开
解决办法见链接:用navicat连接数据库报错1130如何处理
- 连接MySQL数据库报错1045原因:
mysql没有授权远程连接,权限不够
解决办法见链接:navicat连接mysql时报错1045问题
Navicat远程连接云服务器mysql会报各种奇奇怪怪的错误,Navicat用户手册也没有报错解决方案,只能Google一条一条边查边解决了 - 连接MySQL数据库报错2013原因有二:
1、云服务器防火墙开启中
2、mysql数据库中的user的表中没有权限
导入向导–>按步操作、注意编码



方法二、使用DataGear后台将本地csv文件导入数据分析中的数据集
注意:本地csv文件编码格式与DataGear数据导入时所选的编码格式要统一
方法:可以用Notepad++转换本地csv文件格式
详见于本文:数据源管理–>添加数据源
方法四、命令行:
创建数据库
mysql> create database datagear;
Query OK, 1 row affected (0.00 sec)
mysql> show databases;
+--------------------+
| Database |
+--------------------+
| information_schema |
| codexy_top |
| datagear |
| mysql |
| performance_schema |
| studyzzz_top |
+--------------------+
6 rows in set (0.00 sec)
创建数据表……后续略
生成图表、看板
需要html编程基础……
2021/4/16停更