全新唯杰AI可视化平台发布：全面拥抱AI，大屏智能体(Agent)来了

言

唯杰地图 vjmap 一直专注于 CAD 图纸与 GIS 地图在 Web 端的高性能展示；随后发布的 WebCAD 编辑平台 又把「在浏览器里真正编辑 DWG」这件事做成了。

但一线项目里，用户的下一句话往往是：

“图纸能看、能编还不够。我们还要指挥大屏、工业组态、三维孪生，并且最好能让 AI 直接帮我们搭页面、改页面。”

传统做法通常是三套甚至四套工具：BI 大屏一套、SCADA 一套、三维引擎一套、CAD/GIS 再单独一套。数据对不齐、交互对不齐、发布对不齐，二次开发更是各写各的。

历经持续打磨，今天我们正式发布 唯杰AI可视化平台。

它不是又一个只能拖图表的“大屏编辑器”，而是一套把 可视化大屏、2D 地图（CAD + 互联网底图）、工业组态 SCADA、WebGPU 三维孪生 收进同一份工程文件的平台；编辑器与运行时同源渲染，并且全面接入 MCP，让 Cursor 等 AI 助手可以直接检索文档、校验工程、甚至操作正在打开的页面。

---

一、产品功能与核心优势

 

1. 项目管理：三百多个示例工程，分类即点即开

登录后进入首页「我的项目」。这里管理全部大屏：搜索（支持拼音/首字母）、分类、导入工程文件、新建、多选、回收站。访客工作区目前已有 三百余个 示例工程，覆盖布局、地图、三维、组态、数据交互和综合大屏。

分类不是摆设。例如「综合大屏 · 科技风」可以直接看到能源监测、设备运行、城市态势等完整驾驶舱封面：

「组态」分类下是换热站、水厂、2.5D 泵站、图元库等工艺监控工程：

「三维 · 场景」则按元素与行业场景拆开，灯光、粒子、管网、CAD 转 3D、倾斜摄影配方都能点进去看：

新建工程时，不必从空白画布起步。模板里直接提供固定大屏、等比铺满，以及 CAD 图纸 / 互联网地图 / 组态监控台 / 三维巡检 等带内容的起点：

点进任意一张封面，才是真正的主战场——可视化编辑器。

2. 所见即所得的主编辑器

编辑器是经典的四区布局：左侧图层树 + 组件库，中间画布（带标尺），右侧样式 / 数据 / 事件 / 代码，顶部预览、保存、历史、发布。右下角还有 AI 助手。

下面这张是点进「智慧工厂综合驾驶舱」后的真实编辑界面：行列嵌套布局、KPI、趋势图、饼图，以及由数据规则触发的告警弹窗，都在同一块 1920×1080 画布上。

点顶部 预览，进入运行态。编辑时看到的，就是发布后呈现的——同源渲染，没有“编辑器一套、播放器一套”的错位。告警弹窗、产线筛选、实时滚动趋势在预览里都会真正跑起来：

同一套编辑器，换一个能源 KPI 驾驶舱、园区指挥中心，布局策略可以是百分比自适应，组件会随容器缩放而不是被拉变形：

核心心智模型很简单：

概念	含义
工程 Project	一个大屏的全部内容，可导出为 *.vpproj.json
页面 Screen	一块画布，可多页，以及前景 / 背景层
窗口 Window	与页面平级的浮层（弹窗 / 抽屉）
组件 Widget	图表、文本、表格、地图、组态、三维……
连接 / 绑定	数据源 + [连接, 表, 字段] 三元组
事件交互	触发器 → 动作
图元 Piece	地图图层、组态图元、三维元素（放在搭建型组件内部）

编辑器与运行时使用同一份工程、同一套渲染逻辑。 保存是草稿，发布才生成观看者看到的快照，两者互不干扰。

3. 数据驱动：连接、表、字段，组件跟着数据走

菜单「数据 → 编辑数据」打开连接面板。一个工程可以挂多路数据：平台数据、API、WebSocket、Webhook、PostMessage、模拟数据，以及 Excel / CSV / JSON 文件。

首页左侧还有独立的 数据管理：建表、录入，大屏用「平台数据」源实时订阅。后台改数，绑定组件自动重渲。

绑定方式统一为三元组 [连接, 表, 字段]。再往上是数据规则、筛选、联动选中和条件样式——图表、表格、组态测点、三维状态色走的是同一套数据系统。

4. 2D 地图：CAD 图纸与互联网底图一张图

2D 地图是搭建型组件：本体决定坐标系（CAD / 地理），再往上叠数据源和图层。高德 / 天地图 / OSM 可以做底图，DWG 可以做工程图，两者还能互相叠加。

点进「地图为底 + 悬浮面板」，画布中央就是全国态势图，左右是指标、排行和明细表——典型的 GIS 指挥大屏：

点进安全隐患管理平台，则是停靠布局 + CAD 矿图：隐患统计、分类、趋势和详情面板围着图纸转，图层可开关，点位可定位。

地图子系统覆盖标绘、聚合、动画、GPU 特效、立体、WMS/WMTS 服务瓦片，以及测量、导出图片 / PDF 等控件。这是 vjmap 内核直接进大屏，而不是“再嵌一个 iframe 地图”。

5. 组态 SCADA：工艺流程图也能拖出来

组态（scada-2d）用 SVG 画工艺流程：泵、阀、罐、仪表、电力单线、新能源、暖通……图元用测点长表驱动状态色、液位、数值和管流动画。

点进「等比铺满组态工艺监控」，左侧是测点实时表，右侧是换热站流程：罐体液位、泵旋转、连线流动，都在编辑器画布上直接看到。

组态通常独占一页、按场景坐标摆放，主题切换后整屏颜色协调。需要 2.5D 厂站、路径动画、值驱动几何时，同一套图元库也能铺满混凝土地坪做等轴测泵站。

6. 三维场景：WebGPU 数字孪生 / 三维组态

三维（scene-3d）默认 WebGPU、不支持则回退 WebGL。双击进入后，左侧组件库切成 3D 物料：场景、灯光、形状、模型、标注、组态件、特效，拖拽即插入。

点进「三维场景巡检」，机组、液位、测点牌和巡检面板叠在同一个三维视口里：

再点进「智慧水厂工艺总控」，三维罐体、管网和水质 / 泵房看板在同一场景中，还可以在画布上直接点演练按钮看告警态：

三维元素支持测点驱动（状态色、闪烁、流动）、点击聚焦 / 飞行 / 剖切 / 弹窗，以及倾斜摄影、CAD 转 3D、瓦片地图底图。2D 地图管平面一张图，组态管工艺流程，三维管真空间——三者可以同页混排。

7. 组件、交互、窗口，以及二次开发

内置 79 个组件（文本、图表、表格、容器、装饰、媒体、时间、指标、布局、地图控件……），再加上地图图层、三维元素、组态形状，搭建物料超过两百种。

事件是可视化编排：触发器 → 动作。点击、悬停、入场、数据规则满足、定时器，可以改属性、切页面、开窗、请求接口、切换多状态。窗口与页面平级，适合告警弹窗、抽屉、锚定信息窗。

二次开发有三条路，按深度选：

1. 可视化编辑器：零代码搭建，适合大多数交付。

2. 工程文件：纯数据 JSON，可版本管理、可脚本 / AI 生成；也可导出 *.vp.tsx 用代码改整页。

3. SDK 嵌入：一行挂载到你自己的系统里。

import { createVpViewer } from '@vp/sdk'
​
const ctx = createVpViewer('#app', body, {
  params: { theme: 'dark' },
  onReady(ctx) {
    // 推数、切页、开窗、听事件，都走 ctx
  },
})

ctx.setData 实时推数，ctx.on 监听大屏行为事件，地图 / 组态 / 三维还有专用句柄。开发文档里每个组件都带可交互预览，改参数立刻看到效果。

---

二、全面拥抱 AI：大屏智能体 (Agent) 来了

工具搬到网页上只是第一步。真正改变工作方式的是：你可以用自然语言问页面、改页面，也可以把平台接到 Cursor / Trae 等 AI 编程环境里，让助手直接操作正在打开的工程。

编辑器内置 AI 助手

编辑器右下角的 AI 按钮打开助手面板。它走平台进程内的 Agent，能看当前页有哪些组件，也能按你的一句话改标题、换科技风、甚至从零搭一屏。输入栏支持把当前大屏截图（可标注）发给多模态模型。

官方 MCP：给 AI 一双“操作大屏的手”

平台提供标准 MCP（Model Context Protocol） 服务。把它配进 Cursor 等客户端后，AI 可以：

• 检索组件元数据与开发文档（不要靠猜测选项名）

• 列出 / 读取白名单示例

• 校验工程 JSON

• 连上浏览器里正在打开的页面：读结构、改属性、切页、开窗、推数、截图核对、保存（live 实时控制）

MCP 地址：https://vjmap.com/server/vp/mcp

在 Cursor 的 mcp.json 里增加：

{
  "mcpServers": {
    "vjappvisual": {
      "url": "https://vjmap.com/server/vp/mcp"
    }
  }
}

打开某个工程后，还可以在 AI 面板复制 工程 MCP 地址（指向当前项目）或 本标签地址（精确指向当前编辑页）。 推荐工作流是：

1. 让 AI 先 page_list_elements / page_get_schemas 看真实属性路径

2. 再一次性 page_batch_set_options 改样式或数据

3. page_screenshot 目视核对

4. 确认后再 page_save

文档里把端点、工具清单、live 语义和安全约束写得很完整：

对企业来说，更重要的是：你可以基于这份工程格式 + MCP，做成自己行业的“大屏智能体”——水电调度技能、园区一张图技能、煤矿隐患技能，不必从渲染引擎重新发明一遍。

---

三、总结

唯杰AI可视化平台要解决的，不是“再做一个好看的图表库”，而是把这些长期被拆开的能力收拢到同一套产品里：

• 零代码编辑器：拖组件、绑数据、配交互、预览发布

• 一份工程描述一切：页面、数据、交互、地图图层、组态图元、三维元素都在工程文件里

• CAD / GIS / 组态 / 三维 同屏协作，而不是四个孤立产品

• SDK 把做好的大屏嵌进你自己的系统，程序化推数与控屏

• MCP + 内置 AI：人可以搭，AI 也可以搭、也可以改

百闻不如一点。公网已开放体验，建议直接 访客进入，在首页点开任意封面，进入编辑器看真实工程：

• 唯杰AI可视化平台（主编辑器）：https://vjmap.com/server/vp/

• 开发文档：https://vjmap.com/app/docsvp/

• SDK 在线示例：https://vjmap.com/app/demovp

• MCP 地址：https://vjmap.com/server/vp/mcp