GoView:Start14.6k,上车啦上车啦,Vue3低代码平台GoView,零代码+全栈框架
GoView:Start14.6k,上车啦上车啦,Vue3低代码平台GoView,零代码+全栈框架
项目介绍
GoView 是一个Vue3搭建的低代码数据可视化开发平台,将图表或页面元素封装为基础组件,无需编写代码即可完成业务需求。 它的技术栈为:Vue3 + TypeScript4 + Vite2 + NaiveUI + ECharts5 +VChart + Axios + Pinia2 + PlopJS
技术栈
- 前端框架:Vue3,这是目前流行的前端框架之一,提供了良好的开发体验和高效的渲染机制。
- 类型检查:TypeScript4,为项目提供了静态类型检查,有助于减少运行时错误。
- 构建工具:Vite2,具有快速的冷启动和热更新特性,能显著提升开发效率。
- UI库:NaiveUI,一个现代化的UI组件库,提供了丰富的组件以满足各种界面需求。
- 图表库:ECharts5结合VChart,ECharts是一个强大的图表库,VChart则是其在Vue中的封装,使得图表的使用更加便捷。
- HTTP请求:Axios,用于发起HTTP请求,获取后端数据。
- 状态管理:Pinia2,作为Vue的状态管理库,帮助管理应用中的全局状态。
- 脚手架工具:PlopJS,用于生成项目模板,提高开发初期的效率。
核心功能
GoView是一个功能强大的数据可视化库,主要包含以下核心功能:
1. 多种图表支持
GoView支持多种常见图表类型,如折线图、柱状图、饼图、雷达图等,满足各种数据展示需求。
2. 自定义配置
用户可以根据需求自定义图表的样式、颜色、字体等,让图表更具个性化。
3. 数据实时更新
GoView支持实时数据更新,让图表展示更加动态、实时。
4. 易于集成和使用
GoView提供了简洁的API,使得开发者可以轻松集成到自己的项目中。
应用场景
GoView广泛应用于以下场景:
- 数据分析报告
- 仪表盘展示
- 大屏监控
- 业务数据可视化
以下是我们对项目内容的详细撰写:
使用方法
1. 安装GoView
git clone https://gitee.com/dromara/go-view
# 安装项目依赖
# 推荐使用 pnpm
pnpm install
# 或 yarn
yarn install
## 启动
# 推荐使用 pnpm
pnpm dev
# 或 yarn
yarn dev
# 或 Makefile(需要自行配置系统环境,谷歌 make 命令环境搭建)
make dev
# 编译
# 推荐使用 pnpm
pnpm run build
# 或 yarn
yarn run build
# 或 Makefile
make dist
2. 创建柱状图
以新增一个柱状图组件为例:
// 公共类型声明
import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d'
// 当前[信息模块]分类声明
import { ChatCategoryEnum,ChatCategoryEnumName } from '../../index.d'
export const BarCommonConfig: ConfigType = {
// 唯一key,注意!!!文件夹名称需要修改成与当前组件一致!!!
key: 'BarCommon',
// 图表组件渲染 Components 格式: V + key
chartKey: 'VBarCommon',
// 配置组件渲染 Components 格式: VC + key
conKey: 'VCBarCommon',
// 名称
title: '柱状图',
// 子分类目录
category: ChatCategoryEnum.BAR,
// 子分类目录
categoryName: ChatCategoryEnumName.BAR,
// 包分类
package: PackagesCategoryEnum.CHARTS,
// 组件框架类型 (注意!若此 Echarts 图表不支持 dataset 格式,则使用 ChartFrameEnum.COMMON)
chartFrame: ChartFrameEnum.ECHARTS,
// 图片 (注意!图片存放的路径必须在 src/assets/images/chart/包分类名称/*)
// 文件夹名称需要和包分类名称一致: PackagesCategoryEnum.CHARTS
image: 'bar_x.png'
}
项目展示
以下是GoView创建的一些图表示例:
同类项目比较
1. ECharts
ECharts是一款广泛应用于前端的数据可视化库,支持多种图表类型和丰富的自定义配置。与GoView相比,ECharts主要用于前端,而GoView则专注于后端生成图表。
2. Highcharts
Highcharts是一款基于JavaScript的数据可视化库,提供了丰富的图表类型和交互功能。与GoView相比,Highcharts需要前端有一定的JavaScript基础,而GoView则更易于Go语言开发者使用。
结语
GoView利用这些技术,为用户提供了一个强大且易用的数据可视化开发平台,降低了开发门槛,提高了开发效率。无论是数据分析师、业务人员还是开发人员,都能在GoView中快速搭建出满足需求的数据可视化应用。GoView凭借其丰富的图表类型、简洁的API和易于集成的特点,在数据可视化领域具有广泛的应用前景。希望通过本文的介绍,能让大家对GoView有更深入的了解,并在实际项目中发挥其强大的功能。
项目地址
https://gitee.com/dromara/go-view
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 地球OL攻略 —— 某应届生求职总结
· 提示词工程——AI应用必不可少的技术
· Open-Sora 2.0 重磅开源!
· 周边上新:园子的第一款马克杯温暖上架