2025年了,还有产品没有集成AI能力的就是落伍了
以下几个场景能力可实现组态平台的智能化升级:
1. 智能知识库 通过智能知识库快速查询问题、降低用户学习成本。
2. 数字人控件 编辑器控件、语音介绍大屏内容的数据情况、功能介绍等、提升大屏交互体验、智能化、高级感!
3. AI Coding 组态有不少的地方需要写点JS处理业务逻辑的,这些地方都可以通过 AI Coding 自动生成 JS 代码,用户通过Prompt实现自动编写,简化业务逻辑开发、智能化、傻瓜式。
一、数字人控件
在组态大屏编辑器中新增 “数字人控件”,用户可配置数字人形象、语音内容(关联大屏数据 / 功能说明),运行时数字人通过语音 + 动作讲解内容。
1.1 数字人形象与动作
- 采用 “腾讯云数字人” API(支持 2D/3D 形象定制,动作与语音同步);
- 备选方案:本地部署 “SadTalker”(开源数字人驱动工具,需前端集成 WebGL 渲染)。
1.2 语音合成(TTS)
- 对接 “阿里云智能语音服务”(支持多音色、语速调节,可将文本 / 变量动态转为语音);
- 关键需求:支持从大屏数据中提取变量(如 “当前温度
{{temp}}℃”),TTS 需实时解析变量值并合成语音。
1.3 控件交互逻辑
1.3.1 编辑器端:用户拖拽 “数字人控件” 至画布,配置面板支持
- 形象选择(调用腾讯云数字人列表 API);
- 语音内容编辑(支持文本输入 + 数据变量绑定,如关联图表的 “最大值”“平均值”);
- 触发方式(定时播放 / 点击播放 / 数据变化触发)。
1.3.2 运行时
- 前端实时获取大屏数据,替换语音文本模板中的变量;
- 调用阿里云 TTS API 生成语音音频(返回 MP3 格式);
- 将音频 URL 传入腾讯云数字人 API,获取带动作的数字人视频流(或 WebGL 渲染数据),在控件区域播放。
二、智能知识库
用户可通过自然语言查询组态平台的操作指南、API 文档、常见问题等,获取精准答案。
2.1、腾讯云的VDB
详情可以去腾讯官方文档了解。
2.2、使用Dify
开源 LLM 应用开发平台,支持知识库管理、prompt 工程、多模型集成:Introduction - Dify Docs
2.2.1 模型选择
- 基础问答:优先使用通义千问 - 7B(本地化部署,低延迟);
- 复杂问题:调用 GPT-4 API(高精度,通过 Dify 的模型路由功能动态切换)。
2.2.2 知识库数据来源
- 结构化数据:组态平台的产品手册(PDF)、API 文档(Swagger 导出 JSON)、帮助中心文章(Markdown);
- 非结构化数据:用户常见问题日志(通过后端埋点收集,定期同步至 Dify)。
2.2.3 实现流程
- 通过 Dify 的 “知识库” 功能,上传 / 同步上述数据,自动进行文本分割与向量存储(依赖 Dify 集成的 Chroma 向量数据库);
- 前端新增 “Copilot 问答入口”(悬浮窗 / 侧边栏),用户输入问题后,前端调用后端封装的 Dify API(需携带用户 Token 鉴权);
- 后端通过 Dify 的 “对话 API” 发起查询,Dify 自动匹配知识库上下文并生成答案,返回至前端展示;
- 支持 “追问” 功能(前端缓存历史对话,每次请求携带上下文)。
三、JS 代码自动生成
在组态平台需编写 JS 业务逻辑的场景(如自定义函数、数据解析、echarts配置、表格等),用户通过自然语言描述需求,AI 自动生成可直接使用的 JS 代码。
3.1 代码生成模型
- 基础场景:使用 “CodeLlama-7B”(本地化部署,支持 JS 语法,开源免费);
- 复杂场景:调用 “GPT-4o Code” API(高精度,支持上下文理解)。
3.2 集成工具
- 前端编辑器:基于 “Monaco Editor”(VS Code 同款内核)扩展,新增 “AI 生成” 按钮;
- 后端服务:使用 “LangChain” 封装模型调用逻辑,添加组态平台特有的代码生成规则(如 API 约束、变量命名规范)。
3.3 实现流程
- 用户在代码编辑区点击 “AI 生成”,输入需求描述(如 “当按钮点击时,过滤表格中温度大于 30 的数据”、再如:“帮我处理这个xx数据源的接口返回结构为表格的格式”);
- 前端自动补充上下文信息(如当前可用的 API 列表、变量类型,通过后端接口获取),一并发送至后端;
- 后端通过 LangChain 构建 prompt(格式:需求:
${userInput}\n约束:${apiRules}\n生成JS代码:),调用代码生成模型; - 模型返回代码后,后端进行语法校验(使用 “ESLint”)和安全性过滤(禁止 eval、document.write 等危险操作);
- 前端将校验后的代码填充至编辑区,支持 “一键替换”“二次编辑”。
总结
以上是个人在工作中,负责组态可视化编辑器开发时做的设计。具体实现细节可能和本文有所差异,但是方向是一致的。