一、项目简介

我人麻了！基于SpringBoot、MyBatisPlus、Vue等技术栈的大屏设计器

二、实现功能

数据源接入

数据源接入是大数据分析和可视化流程的第一步。这一阶段的主要任务是收集和集成来自不同来源的数据，为后续的数据清洗处理和分析奠定基础。以下是详细的步骤和注意事项：

1. 识别数据源

在数据源接入阶段，首先需要识别所有相关的数据源。这些数据源可以包括：

数据库：如关系型数据库（MySQL、PostgreSQL、Oracle）、非关系型数据库（MongoDB、Redis）。

文件：CSV、Excel、JSON、XML 文件。

API：来自外部服务或应用程序的 API 接口，如 RESTful API。

流数据：如实时数据流（Kafka、RabbitMQ）。

第三方服务：社交媒体、天气数据服务等。

2. 连接数据源

为了从数据源中提取数据，需要建立连接。根据数据源的类型，连接方法可能有所不同：

数据库连接：使用相应的数据库连接驱动程序和库（如 JDBC、ODBC），并提供连接字符串、用户名和密码。

文件读取：使用文件系统操作函数读取文件内容。

API 请求：使用 HTTP 客户端库发送 GET 或 POST 请求，并处理返回的数据。

流数据接入：使用流处理框架（如 Apache Kafka、Apache Flink）进行数据接收。

3. 数据抽取

从连接的数据源中抽取数据，通常涉及以下步骤：

查询：编写 SQL 查询或 API 请求来获取需要的数据。

数据提取：执行查询或请求，获取数据。

数据存储：将提取的数据存储到临时数据库或数据湖中，为后续处理做好准备。

4. 数据访问权限

确保数据源的访问权限设置正确，以防数据泄露或未经授权的访：

认证：使用安全的认证机制（如 OAuth、API 密钥）进行数据访问。

授权：配置适当的用户权限，以确保只有授权人员可以访问数据源。

数据清洗处理

数据清洗处理是确保数据质量的关键步骤，目的是将原始数据转换为干净、一致和可靠的格式。以下是详细的步骤和注意事项：

1. 数据验证

在清洗之前，需要验证数据的完整性和准确性：

格式验证：检查数据格式是否符合预期（如日期格式、数值范围）。

缺失值检查：识别数据中的缺失值，并决定如何处理（如填充、删除）。

2. 数据去重

去重是数据清洗中的重要任务，确保数据集中没有重复记录：

重复检测：识别并标记重复的数据行。

数据合并：根据业务逻辑合并重复记录，保留唯一的有效记录。

3. 数据标准化

将数据转换为一致的格式，以确保其可用性和可比性：

格式统一：将日期、货币等字段标准化为统一格式。

单位转换：将不同单位的数据转换为统一单位（如将长度从米转换为千米）。

4. 数据清理

清理数据中的错误和异常值：

处理异常值：识别和处理超出正常范围的数据点（如去除异常的极值）。

修正错误：纠正数据输入错误或不一致性（如拼写错误、格式不一致）。

5. 数据转换

将数据转换为适合分析和可视化的格式：

数据集成：将来自不同数据源的数据整合到一个数据集中。

数据聚合：根据需要对数据进行聚合（如计算总和、平均值）。

大屏设计

大屏设计是将清洗后的数据以直观的方式展示出来的过程。设计一个有效的大屏展示需要考虑以下几个方面：

1. 需求分析

明确展示内容和目标用户：

用户需求：了解目标用户的需求，确定展示的数据类型和内容。

业务目标：根据业务需求确定大屏的核心指标和展示方式。

2. 设计布局

设计大屏的布局，确保信息展示清晰、易于理解：

信息层次：确定信息的层次结构，重要数据放在显著位置。

视觉效果：使用颜色、字体、图表等元素提高信息的可读性和吸引力。

3. 选择图表和可视化元素

选择合适的图表和可视化元素展示数据：

图表类型：根据数据的性质选择图表类型（如柱状图、折线图、饼图、地图）。

交互性：添加交互功能（如筛选、钻取）以增强用户体验。

4. 设计风格

保持大屏设计风格的一致性：

配色方案：选择符合企业品牌的配色方案。

字体和图标：使用一致的字体和图标风格。

大屏预览

在正式发布之前，进行大屏预览以确保其准确性和效果。预览阶段包括以下步骤：

1. 功能测试

测试大屏的所有功能，确保其正常运行：

数据展示：验证数据的准确性和实时性。

交互功能：测试交互功能是否正常工作。

2. 性能测试

确保大屏在不同环境下的性能稳定：

加载速度：检查大屏的加载速度和响应时间。

兼容性：测试在不同设备和浏览器上的兼容性。

3. 用户反馈

收集用户反馈，进一步优化大屏展示：

用户体验：邀请目标用户进行体验，收集反馈。

问题修复：根据反馈修复发现的问题。

大屏发布上线

大屏发布上线是将设计好的大屏展示给最终用户的过程。发布上线包括以下步骤：

1. 部署准备

准备大屏的发布和部署：

环境配置：配置生产环境，确保服务器和网络的稳定性。

数据源连接：确认数据源连接配置正确，确保数据能够实时更新。

2. 发布

将大屏发布到生产环境中：

部署：将大屏应用部署到生产服务器上。

监控：上线后监控系统的运行状态，确保大屏稳定运行。

3. 上线后维护

发布后进行持续的维护和优化：

问题处理：快速处理上线后出现的问题。

功能更新：根据用户反馈进行功能和界面的优化和更新。

三、技术选型

SpringBoot、MyBatisPlus、Vue

ElementUI、G2Plot、Echarts

1. 大屏管理

支持大屏【新增】、【编辑】、【设计】、【预览】、【复制】、【删除】操作

采用拖拉拽可视化设计，支持30+基础组件、40+种图表组件、15种边框组件、10多种修饰组件

支持资源自定义上传、在大屏设计器中直接引用资源，如：3D图片、边框图片、装饰条、背景图

支持MySQL、PostgreSQL、Oracle 、ClickHouse、SqlServer数据库接入

支持原始数据集、自助数据集、存储过程数据集、JSON数据集、脚本数据集、JS脚本数据集、HTTP数据集多种方式接入数据

五、源码地址

私信回复：65