【限时免费】 GoView 数据可视化低代码平台技术文档

GoView 数据可视化低代码平台技术文档

【免费下载链接】go-view 🏆GoView 是一个Vue3搭建的低代码数据可视化开发平台，将图表或页面元素封装为基础组件，无需编写代码即可完成业务需求。 它的技术栈为：Vue3 + TypeScript4 + Vite2 + NaiveUI + ECharts5 + Axios + Pinia2 + PlopJS 项目地址: https://gitcode.com/GoView/go-view

1. 安装指南

1.1 环境要求

• Node.js: 18.20.x 或更高版本
• npm: 10.7.x 或更高版本
• pnpm: 8.6.7 或更高版本（推荐使用）
• 操作系统: Windows 11 / macOS / Linux

1.2 克隆项目

git clone https://gitee.com/dromara/go-view.git
cd go-view

1.3 依赖安装

pnpm install  # 推荐使用 pnpm
# 或使用 npm
npm install

1.4 启动开发服务器

pnpm dev
# 或使用 npm
npm run dev

访问 http://localhost:5173 即可进入开发环境。

---

2. 使用说明

2.1 项目结构

• src/components: 内置可视化组件
• src/views: 页面逻辑与配置模块
• src/utils: 工具类封装（路由、存储、加解密等）
• src/assets: 静态资源（主题、图片等）

2.2 核心功能

1. 拖拽布局: 通过拖拉拽配置大屏组件，支持自由调整位置与尺寸。
2. 数据绑定: 支持静态数据或动态 API 请求，配置路径为 请求配置 模块。
3. 主题切换: 提供明/暗主题及自定义主题色，配置文件位于 src/theme。
4. 事件联动: 通过 高级事件编辑 实现组件间交互，支持全局方法调用。

2.3 图表配置

• ECharts/VChart 配置: 直接修改组件的 option 属性，支持 JSON 或动态函数生成。
• 数据过滤: 在 数据过滤 模块中配置数据转换规则（如聚合、排序）。

---

3. API 使用文档

3.1 后端集成

项目支持以下后端实现（社区贡献）：

• Java: 提供 RESTful 接口，参考 go-view-serve 项目。
• .NET: 集成示例见 go-view-dotnet。
• Node.js: 参考 led 项目实现数据代理。

3.2 前端 API

数据请求配置

// 在组件配置中定义数据源
{
  "dataSource": {
    "type": "api",
    "url": "/api/data",
    "method": "GET",
    "params": { "id": 1 }
  }
}

事件联动 API

// 使用全局方法触发组件更新
window.$goView.emitEvent('componentId', 'eventName', payload);

---

4. 项目安装方式

4.1 纯前端部署

1. 构建生产包：

   pnpm build
   

2. 部署至 Nginx:
   • 将 dist 目录内容复制到 Nginx 的 html 目录。
   • 配置 nginx.conf 支持路由重定向：

     location / {
       try_files $uri $uri/ /index.html;
     }
     

4.2 内网部署

• 使用 Docker 镜像（参考 go-view-docker 项目）：

  docker pull ahead4/go-view:latest
  docker run -p 8080:80 ahead4/go-view
  

4.3 后端集成部署

• 根据所选后端技术栈（如 Java/.NET）部署服务，并确保前端配置的 API 地址指向后端服务。

---

注意事项

• 浏览器兼容性：推荐使用 Chrome 或 Edge 最新版。
• 自定义组件开发：参考 src/components/custom 示例，支持 Vue3 语法。
• 问题反馈：通过官方社区或 Gitee Issues 提交。

（完）

【免费下载链接】go-view 🏆GoView 是一个Vue3搭建的低代码数据可视化开发平台，将图表或页面元素封装为基础组件，无需编写代码即可完成业务需求。 它的技术栈为：Vue3 + TypeScript4 + Vite2 + NaiveUI + ECharts5 + Axios + Pinia2 + PlopJS 项目地址: https://gitcode.com/GoView/go-view