天天看點

一個Vue3搭建的低代碼資料可視化開發平台,支援多個後端語言

作者:華山論術

概述

GoView 是一個Vue3搭建的低代碼資料可視化開發平台,将圖表或頁面元素封裝為基礎元件,無需編寫代碼即可完成業務需求。 它的技術棧為:Vue3 + TypeScript4 + Vite2 + NaiveUI + ECharts5 + Axios + Pinia2 + PlopJS

整體介紹

  • 架構:基于 Vue3 架構編寫,使用 hooks 寫法抽離部分邏輯,使代碼結構更加清晰;
  • 類型:使用 TypeScript 進行類型限制,減少未知錯誤發生機率,可以大膽修改邏輯内容;
  • 性能:多處性能優化,使用頁面懶加載、元件動态注冊、資料滾動加載等方式,提升頁面渲染速度;
  • 存儲:擁有本地記憶,部配置設定置項采用 storage 存儲本地,提升使用體驗;
  • 封裝:項目進行了詳細的工具類封裝如:路由、存儲、加/解密、檔案處理、主題、NaiveUI 全局方法、元件等
  • 入選 NaiveUI 社群精選資源推薦:檢視 NaiveUI 推薦清單

後端項目看這裡!

後端位址(社群實作,僅供參考):

  • JAVA https://gitee.com/MTrun/go-view-serve (目前使用)
  • .NET https://gitee.com/sun_xiang_yu/go-view-dotnet
  • NODE https://gitee.com/qwdingyu/led
  • Docker 鏡像 https://gitee.com/AHEAD4/go-view-docker
  • 接口文檔https://docs.apipost.cn (不是最新, 以前端代碼為準)

說明文檔:

一個Vue3搭建的低代碼資料可視化開發平台,支援多個後端語言

工作台:

一個Vue3搭建的低代碼資料可視化開發平台,支援多個後端語言

請求配置:

一個Vue3搭建的低代碼資料可視化開發平台,支援多個後端語言

資料過濾:

一個Vue3搭建的低代碼資料可視化開發平台,支援多個後端語言

進階事件編輯:

一個Vue3搭建的低代碼資料可視化開發平台,支援多個後端語言

自定義元件顔色:

一個Vue3搭建的低代碼資料可視化開發平台,支援多個後端語言

快捷首頁:

一個Vue3搭建的低代碼資料可視化開發平台,支援多個後端語言

主題色:

一個Vue3搭建的低代碼資料可視化開發平台,支援多個後端語言

亮白主題:

一個Vue3搭建的低代碼資料可視化開發平台,支援多個後端語言

主要技術棧為:

名稱 版本 名稱 版本
Vue 3.2.x TypeScript4 4.6.x
Vite 4.2.x NaiveUI 2.34.x
ECharts 5.3.x Pinia 2.0.x
詳見 package.json

開發環境:

名稱 版本 名稱 版本
node 16.16.x npm 8.5.x
pnpm 7.1.x windows 11

已完成圖表:

分類 名稱 名稱 名稱 名稱
圖表 柱狀圖 橫向柱狀圖 折線圖 單/多 折線面積圖(漸變色)
* 餅圖 環形圖 水球圖 雷達圖
* NaiveUI 多種進度 散點圖 對數回歸散點圖 熱力圖
* 漏鬥圖 中國地圖 高德地圖
資訊 文字 漸變文字 詞雲 嵌套網頁
* 圖檔 視訊
清單 滾動排名清單 滾動表格
小元件 邊框-01~13 裝飾-01~05 數字翻牌 通用時間
* 數字計數 倒計時 時鐘

浏覽器支援

開發和測試平台均在 Google 和最新版 EDGE 上完成,暫未測試 IE11 等其它浏覽器,如有需求請自行測試與相容。

如何擷取

歡迎關注轉發評論私信

繼續閱讀