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

總結

以上是生活随笔為你收集整理的GoView：Start14.6k,上车啦上车啦，Vue3低代码平台GoView，零代码+全栈框架的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。