SolidUI AI生成可视化,0.1.0版本模块划分以及源码讲解

本文涉及的产品
检索分析服务 Elasticsearch 版,2核4GB开发者规格 1个月
实时计算 Flink 版,5000CU*H 3个月
智能开放搜索 OpenSearch行业算法版,1GB 20LCU 1个月
简介: SolidUI AI生成可视化,0.1.0版本模块划分以及源码讲解

1.背景


随着文本生成图像的语言模型兴起,SolidUI想帮人们快速构建可视化工具,可视化内容包括2D,3D,3D场景,从而快速构三维数据演示场景。SolidUI 是一个创新的项目,旨在将自然语言处理(NLP)与计算机图形学相结合,实现文生图功能。通过构建自研的文生图语言模型,SolidUI 利用 RLHF (Reinforcement Learning Human Feedback) 流程实现从文本描述到图形生成的过程。



## 2. 架构总览

image.png


Entrance:API接口层,主要负责前端UI层的请求,该服务统一提供RESTful api向外部提供请求服务

3.模块功能



  • solidui-bom: BOM(Bill of Materials)通常用于管理项目中的依赖版本,以确保所有模块都使用相同版本的依赖。


  • solidui-common: 这个模块包含整个项目中使用的通用代码和工具。


  • solidui-dao: DAO(Data Access Object)模块包含所有与数据库交互的代码。


  • solidui-datasource-plugin: 这个模块提供一种方式来扩展数据源,以便可以从多种不同类型的数据源获取数据。


  • solidui-dist: 这个模块负责项目的构建和分发。


  • solidui-entrance: 这个模块是项目的主入口点,包含启动和初始化应用程序的代码。


  • solidui-service: 这个模块包含业务逻辑代码。


  • solidui-spi: SPI(Service Provider Interface)模块提供一种方式来扩展项目的功能。


  • solidui-web: 这个模块包含前端代码,用于显示用户界面,聊天界面。


  • soliduimodelui: 这个模块模型代理层,用于前端UI层的数据模型转换。



4.源码讲解


4.1 solidui-bom


这是一个 Maven 的项目对象模型(POM)文件,它是基于 XML 的项目配置文件,用于描述构建项目的信息,如项目依赖、构建插件、项目属性等。


此 POM 文件定义的是一个名为 solidui-bom 的项目,该项目的父项目是 solidui。


在这个 POM 文件中,主要有以下三个部分:



  • Properties: 定义了各种依赖库的版本号。这是一种常见的管理项目中所有依赖库版本的方法,可以在一个地方定义和更新所有依赖的版本。


  • Parent: 定义了这个项目的父项目。在 Maven 中,可以通过定义父项目来继承一些通用的配置,如依赖管理、插件管理等。


  • Dependency Management: 这部分定义了项目的依赖库及其版本。所有在此定义的依赖,都可以在子模块中直接使用而不用指定版本号。如果子模块中的依赖和此处的依赖冲突,那么会优先使用此处定义的版本。



根据这个 POM 文件,你可以知道这个项目依赖了哪些库,以及这些库的版本。此外,如果你需要添加新的依赖库,或者更新现有依赖库的版本,也可以在这个文件中进行。


4.2 solidui-common


Constants: 这个类定义了一些全局常量,这些常量在整个项目中可能会用到。例如,HTTP头的键名、加密的密钥等。


DateConstants: 这个类定义了日期时间的格式化字符串常量。


ByteTimeUtils: 这个类当前看起来是空的,可能是一个方便处理字节和时间的工具类。


DESUtil: 这个类提供了基于DES算法的加密和解密方法,用于数据的安全传输。


EncryptionUtils: 这个类提供了一个计算字符串MD5值的方法。


JSONUtils: 这个类提供了一系列的JSON处理方法,包括对象到JSON的序列化、JSON到对象的反序列化、JSON到List或Map的转换等。


LoginUtils: 这个类提供了一些处理登录用户的方法,例如设置登录用户、移除登录用户和获取登录用户。


Utils: 这个类提供了一些通用的工具方法,例如创建一个有自定义线程名和守护状态的线程工厂,创建一个默认的计划任务执行器。


4.3 solidui-dao


这个模块名为 solidui-dao,主要包含了与数据访问层相关的配置和对象模型。


SpringConnectionFactory: 这个配置类主要用于配置MyBatisPlus的相关设置,如分页插件、事务管理器、SqlSessionFactory等。


DataSource, DataSourceType, DataSourceTypeKey, JobElement, JobElementPage, JobPage, ModelType, Project, User: 这些类是实体类,代表数据库中的各个表的数据结构。


DataSourceMapper, DataSourceParamKeyMapper, DataSourceTypeMapper, JobElementMapper, JobElementPageMapper, JobPageMapper, ModelTypeMapper, ProjectMapper, UserMapper: 这些接口是MyBatis的Mapper接口,用于定义对应表的CRUD操作。


PageListingResult: 这是一个包装类,用于包装分页查询的结果。


DaoConfiguration: 这是一个Spring的配置类,用于启动Spring Boot的自动配置并扫描Mapper接口。


通过这个模块,你可以方便地进行数据库的操作。例如,你可以通过UserMapper的queryUserByNamePassword方法,查询给定用户名和密码的用户。所有的Mapper接口都继承自MyBatisPlus的BaseMapper接口,所以它们都具备了基础的CRUD操作。


4.4 solidui-datasource-plugin


这个模块名为 solidui-datasource-plugin,包含了与数据源插件相关的配置和对象模型。


DorisClient: 这个类继承自BaseJdbcClient,实现了与Doris数据库进行交互的具体方法,包括获取所有数据库、获取数据库的所有表、以及执行查询语句并获取结果。


DorisClientFactory: 这个类继承自BaseJdbcClientFactory,实现了创建DorisClient的工厂方法。


DorisConnectionFactory: 这个类实现了ConnectionFactory接口,提供了创建连接Doris数据库的方法。


MysqlClient: 这个类继承自BaseJdbcClient,实现了与MySQL数据库进行交互的具体方法,包括获取所有数据库、获取数据库的所有表、以及执行查询语句并获取结果。


MysqlClientFactory: 这个类继承自BaseJdbcClientFactory,实现了创建MysqlClient的工厂方法。


MysqlConnectionFactory: 这个类实现了ConnectionFactory接口,提供了创建连接MySQL数据库的方法。


JdbcClientManager: 这个类用于加载配置的ConnectionFactory。


ConnectDTO: 这个类是一个简单的数据传输对象,包含了连接数据库需要的信息,如主机名、端口、用户名、密码、数据库名以及额外参数。


其他接口如JdbcClient、JdbcClientFactory、ConnectionFactory等定义了一些通用的方法,具体的实现类如DorisClient、DorisClientFactory、DorisConnectionFactory等提供了这些方法的具体实现。


此外,这个模块的pom.xml文件配置了solidui-datasource-all子模块,该子模块依赖于solidui-datasource-mysql和solidui-datasource-doris两个模块,这两个模块定义了如何与MySQL和Doris数据库交互。


4.5 solidui-dist


这个模块名为 solidui-dist,它主要负责项目的发布和部署。


docker-compose.yml: 这是一个 Docker Compose 配置文件,用于定义和运行多容器的 Docker 应用。在这个文件中,定义了几个服务:solidui-entrance、solidui-web、mysql 和 soliduimodelui。这些服务将会被 Docker 以容器的形式运行。


release-docs: 这个文件夹可能包含了一些发布文档,如 LICENSE 和 NOTICE。


assembly.xml: 这是 Maven Assembly 插件的配置文件,用于定义如何创建项目的发布包。在这个文件中,定义了需要包含哪些文件和文件夹。


这个模块的作用主要是定义如何打包项目和如何部署项目。通过 Docker Compose,可以非常方便地在任何装有 Docker 的机器上部署和运行这个项目。通过 Maven Assembly 插件,可以非常方便地创建项目的发布包,包含了运行项目所需的所有文件。


4.6 solidui-entrance


这个模块名为 solidui-entrance,作为应用的入口,提供了多个控制器(Controller)用于处理用户的请求。


BaseController: 提供了一些通用的返回结果的方法,包括成功的结果和错误的结果。


DataSourceController: 提供了一系列与数据源相关的API,如获取所有的数据源类型、根据类型获取参数键、根据数据源名和类型查询数据库等。


JobController: 提供了一些与工作相关的API,如保存页面、更新工作、按项目ID查询工作等。


JobPageController: 提供了一些与工作页面相关的API,如创建工作页面、更新工作页面、按项目ID查询工作页面等。


LoginController: 提供了登录和登出的API。


MetadataQueryController: 提供了一些与元数据查询相关的API,如按数据源名查询数据库、按数据源名查询表、按SQL查询等。


ModelController: 提供了获取模型列表的API。


ProjectController: 提供了一些与项目相关的API,如创建项目、更新项目、按项目名查询项目、删除项目等。


每个Controller都依赖于相应的Service,Service中定义了对应的业务逻辑。例如,DataSourceController依赖于DataSourceService,在DataSourceService中定义了如何查询所有数据源类型、如何根据类型获取参数键等业务逻辑。


此外,还提供了一些Service的实现类,如DataSourceServiceImpl、DataSourceTypeServiceImpl、JobPageServiceImpl、JobServiceImpl、MetadataQueryServiceImpl、ModelServiceImpl、ProjectServiceImpl和UserServiceImpl。这些类实现了对应的Service接口,并提供了具体的业务逻辑。


总的来说,这个模块主要处理用户的请求,执行相应的业务逻辑,并返回结果。


4.7 solidui-service


包含了一些服务层的代码。


4.8 solidui-spi


ConnectDTO: 这是一个简单的数据传输对象,包含了连接数据库所需的信息。


ConstantsSPI: 这个类定义了一些常量,这些常量在 SPI(服务提供接口)中可能会用到。


4.9 solidui-web


这是一个基于React和Ant Design构建的前端项目,项目的主要内容包括:



  • 主应用入口index.tsx,用于初始化并渲染整个应用。
  • App组件,是应用的主要组件,用于定义路由和渲染相应的组件。
  • routes定义了应用的所有路由,包括首页、登录页、项目列表页、数据源列表页、仪表盘页和预览页等。
  • DefaultLayout组件定义了应用的主要布局,包括头部、侧边栏和主要内容区域。
  • ProjectListDataSourceList两个组件分别用于展示项目列表和数据源列表。
  • Dashboard组件用于展示仪表盘,展示数据可视化结果。
  • Login组件用于处理用户登录逻辑。
  • Home组件定义了应用的首页内容。
  • useProjectuseDataSource两个自定义Hook,用于处理项目和数据源相关的业务逻辑。
  • ModelManager类,用于管理应用的状态。
  • ViewFactory类,用于创建视图。
  • SolidView类,定义了一个抽象的视图基类,所有的视图组件都需要继承这个基类。

此外,项目还包括了一些辅助性的模块,如ApiService用于封装API请求,theme用于定义主题样式,solidui-entrancesolidui-web分别是后端和前端的主要模块,apiservice定义了一些API接口和服务,components包含了一些公共的组件。


项目使用了一些第三方库,如axios用于处理HTTP请求,lodash-es用于提供一些实用的工具函数,antd是一个基于React的UI组件库,echarts用于数据可视化,react-router-dom用于处理路由,react-window用于优化长列表的渲染性能等。


项目的构建工具是webpack,使用了babel来转译JavaScript代码,eslintprettier用于代码规范和格式化,jest用于单元测试。此外,项目还使用了huskylint-staged来在提交代码前自动检查和修复代码问题。


4.10 soliduimodelui


这是一个基于 Flask 和 MySQL 的后端项目,主要用于处理前端发来的请求并执行相应的操作。主要的功能模块包括:



  • kernel_manager:这个模块主要负责管理和操作 Python 内核,处理前端发来的代码执行请求。内核管理器实现了与 Python 内核的通信,接收和处理内核的输出结果,以及处理内核的各种状态。此外,它还提供了一个消息队列用于接收和发送内核的消息。


  • kernel_program:这个模块主要负责启动和管理 Python 内核的子进程。它通过子进程的方式启动 Python 内核,然后通过 SnakeMQ 消息队列与内核进行通信。


  • utils:这个模块提供了一些实用的工具函数,如发送 JSON 消息、初始化 SnakeMQ 消息队列等。


  • webapp:这是一个基于 Flask 的 Web 应用,它提供了一系列的 API 供前端调用,如执行代码、获取执行结果、管理 Python 内核等。这个应用使用了 CORS 中间件来处理跨域请求。


  • web_utils:这个模块提供了一些 Web 应用中常用的工具函数,如格式化响应数据、查询数据库等。


  • .env:这是一个环境变量配置文件,包含了数据库的连接信息、应用的端口号等配置信息。



项目的运行流程大致如下:



  1. 启动 Flask Web 应用,提供 API 接口供前端调用;
  2. 前端发起请求,如执行代码等;
  3. Web 应用接收请求,调用内核管理器执行相应的操作;
  4. 内核管理器通过 SnakeMQ 消息队列与 Python 内核进行通信,执行代码并获取结果;
  5. Web 应用将执行结果返回给前端。

此外,项目还提供了一些辅助功能,如日志输出、错误处理等。


5.成为贡献者



  • 官方文档贡献。发现文档的不足、优化文档,持续更新文档等方式参与社区贡献。通过文档贡献,让开发者熟悉如何提交PR和真正参与到社区的建设。参考攻略:https://github.com/CloudOrc/SolidUI/discussions/54
  • 代码贡献。我们梳理了社区中简单并且容易入门的的任务,非常适合新人做代码贡献。请查阅新手任务列表:https://github.com/CloudOrc/SolidUI/issues/12
  • 内容贡献:发布SolidUI开源组件相关的内容,包括但不限于安装部署教程、使用经验、案例实践等,形式不限,请投稿给小助手。例如:https://github.com/CloudOrc/SolidUI/issues/10
  • 社区答疑:积极在社区中进行答疑、分享技术、帮助开发者解决问题等;
  • 其他:积极参与社区活动、成为社区志愿者、帮助社区宣传、为社区发展提供有效建议等;

相关实践学习
如何在云端创建MySQL数据库
开始实验后,系统会自动创建一台自建MySQL的 源数据库 ECS 实例和一台 目标数据库 RDS。
全面了解阿里云能为你做什么
阿里云在全球各地部署高效节能的绿色数据中心,利用清洁计算为万物互联的新世界提供源源不断的能源动力,目前开服的区域包括中国(华北、华东、华南、香港)、新加坡、美国(美东、美西)、欧洲、中东、澳大利亚、日本。目前阿里云的产品涵盖弹性计算、数据库、存储与CDN、分析与搜索、云通信、网络、管理与监控、应用服务、互联网中间件、移动服务、视频服务等。通过本课程,来了解阿里云能够为你的业务带来哪些帮助     相关的阿里云产品:云服务器ECS 云服务器 ECS(Elastic Compute Service)是一种弹性可伸缩的计算服务,助您降低 IT 成本,提升运维效率,使您更专注于核心业务创新。产品详情: https://www.aliyun.com/product/ecs
目录
相关文章
|
5天前
|
人工智能 语音技术
通义语音AI技术问题之semantic 的 residualquantizer 模块的作用如何解决
通义语音AI技术问题之semantic 的 residualquantizer 模块的作用如何解决
22 9
|
5天前
|
人工智能 前端开发 语音技术
通义语音AI技术问题之CAM++模型中的CAM模块工作原理如何解决
通义语音AI技术问题之CAM++模型中的CAM模块工作原理如何解决
14 4
|
17天前
|
机器学习/深度学习 人工智能 自然语言处理
AIGC:人工客服耗钱耗力!AI客服才是版本答案!
AIGC:人工客服耗钱耗力!AI客服才是版本答案!
|
24天前
|
人工智能
魔搭多模态AI单词助记&通义APP即时口语练习,你从未体验过的全新版本!
首次接触魔搭多模态AI单词助记工具让我颇感惊喜。传统背单词方式枯燥低效,而该工具通过生成关联图像、短语或故事,让记忆变得生动有趣。访问[Word-wizard](https://modelscope.cn/studios/makabakaing/Word-wizard)体验其图文记忆和视觉学习功能。目前图文记忆功能似乎存在问题,但视觉学习功能仍可正常使用,能识别图片特征并生成释义和例句,辅助学习效果不错。此外,可通过通义APP实现即时口语练习,尽管缺乏上下文记忆功能,但仍是一个优秀的练习工具。
|
2天前
|
人工智能 IDE 测试技术
Visual Studio版本的AI编程助手
Visual Studio 是一个出色的 IDE,可用于构建适用于 Windows、Mac、Linux、iOS 和 Android 的丰富、精美的跨平台应用程序。 使用一系列技术(例如 WinForms、WPF、WinUI、MAUI 或 Xamarin)构建丰富。 1、安装 点击上方工具栏拓展选项,选择管理拓展选项 接着在联机页面中搜索"FItten Code",并点击下载,下载完成后重启Visual Studio 在扩展选项中选中fitten,选择Open Chat Window进入登录界面,完成注册登录 2、智能补全 打开代码文件,输入一段代码,Fitten Code 就会为您
9 0
|
7天前
|
机器学习/深度学习 人工智能 Linux
【机器学习】Dify:AI智能体开发平台版本升级
【机器学习】Dify:AI智能体开发平台版本升级
38 0
|
2月前
|
人工智能 图形学
【制作100个unity游戏之24】unity制作一个3D动物AI生态系统游戏2(附项目源码)
【制作100个unity游戏之24】unity制作一个3D动物AI生态系统游戏2(附项目源码)
42 1
【制作100个unity游戏之24】unity制作一个3D动物AI生态系统游戏2(附项目源码)
|
1月前
|
人工智能 IDE 测试技术
采用Visual Studio版本的AI编程助手
Visual Studio 是多平台IDE,用于构建Windows、Mac、Linux、iOS和Android应用。安装Fitten Code插件可增强其功能,如智能补全、AI问答、代码生成、翻译、注释自动生成、代码解释和测试用例创建。通过扩展商店搜索安装Fitten Code,登录后体验上述特性。支持VS Code、JetBrains IDE、Visual Studio和Vim。访问[https://code.fittentech.com/](https://code.fittentech.com/)获取更多信息。
46 4
|
21天前
|
存储 人工智能
[AI Mem0] 源码解读,带你了解 Mem0 的实现
[AI Mem0] 源码解读,带你了解 Mem0 的实现
|
21天前
|
人工智能 自然语言处理 数据挖掘
详解:Google AI Gemini中文版本(基于API 开发实现对话)
谷歌旗下的人工智能应用Gemini,自问世以来凭借其强大的计算能力和高效的处理性能,迅速成为全球用户的宠儿。作为一款由世界顶尖科技公司开发的产品,Gemini不仅在语言处理、图像识别、数据分析等领域表现出色,还在多种复杂任务中展现了其卓越的智能决策能力。然而,由于网络限制等问题,国内用户往往无法直接访问和使用Gemini的网站,这也导致了许多技术爱好者和专业人士未能亲身体验这一先进技术所带来的便利和强大功能。