簡(jiǎn)介

GitDataV基于Vue框架構(gòu)建的github數(shù)據(jù)可視化平臺(tái),是一個(gè)github“大數(shù)據(jù)可視化平臺(tái)”，通過(guò)它你可以更直觀的看到你在github里的一些數(shù)據(jù)：
個(gè)人信息(?)，倉(cāng)庫(kù)stars情況(?)，倉(cāng)庫(kù)語(yǔ)言分類(lèi)(?)
倉(cāng)庫(kù)公開(kāi)數(shù)量(?)、粉絲數(shù)量(?)、跟隨數(shù)量(?)、倉(cāng)庫(kù)數(shù)據(jù)(?)、最近你的操作(?)
最近的粉絲(?)、最近的跟隨(?)、最新信息(?)
左上角箭頭小彩蛋： 全屏(?)、 國(guó)際化語(yǔ)言切換(?)、返回首頁(yè)(?)

github 地址：

https://github.com/HongqingCao/GitDataV

github star: 919+

最新版本：2.1.0，MIT 協(xié)議

主要技術(shù)棧:

vue(vue項(xiàng)目構(gòu)建、指令的靈活運(yùn)用、組件封裝、組件之間通信)vue-router(路由預(yù)備知識(shí)：hash和history區(qū)別、動(dòng)態(tài)路由、路由切換傳參)vuex、vue-i18n(語(yǔ)言切換)網(wǎng)絡(luò)請(qǐng)求axios(自己封裝axios、跨域代理配置)可視化工具echarts、v-charts處理圖形(控制大小、布局、顏色、接受數(shù)據(jù)格式)es6(基礎(chǔ)語(yǔ)法，比如在梳理數(shù)據(jù)過(guò)程中用到map遍歷數(shù)組、對(duì)象和數(shù)組轉(zhuǎn)換等等)scss(配置、語(yǔ)法)bootstrap、iconfont

項(xiàng)目截圖

項(xiàng)目目錄結(jié)構(gòu)

├── README.md 項(xiàng)目介紹├── vue.config.js 項(xiàng)目配置├── deploy.sh 部署文件├── package.json npm包配置文件，里面定義了項(xiàng)目的npm腳本，依賴(lài)包等信息├── src 源碼目錄 │ ├── main.js 入口js文件│ ├── router.js 路由│ ├── store.js vuex狀態(tài)│ ├── app.vue 根組件│ ├── components 公共組件目錄│ │ └── index.js 把全部組件遍歷出來(lái)│ ├── lang 語(yǔ)言切換字典│ │ └── index.js 語(yǔ)言切換字典│ ├── assets 資源目錄，這里的資源會(huì)被wabpack構(gòu)建│ │ └── css css基礎(chǔ)重置│ │ └── data 可視化界面需要的圖片│ │ └── iconfont 字體圖標(biāo)│ │ └── bg.png│ └── views 頁(yè)面目錄│ ├── app 入口文件│ └── data 可視化文件├── static 純靜態(tài)資源，不會(huì)被wabpack構(gòu)建。

快速上手

git clone https://github.com/HongqingCao/GitDataV.git cd GitDataV# 安裝依賴(lài)npm install# 啟動(dòng)本地開(kāi)發(fā)環(huán)境(localhost:8080)npm run dev# 編譯npm run build# 運(yùn)行測(cè)試npm test

瀏覽器兼容性

• IE / Edge

開(kāi)源項(xiàng)目未提供

• Firefox

開(kāi)源項(xiàng)目未提供

• Chrome

開(kāi)源項(xiàng)目未提供

• Safari

開(kāi)源項(xiàng)目未提供

• Opera

開(kāi)源項(xiàng)目未提供

PS

這個(gè)開(kāi)源項(xiàng)目利用github網(wǎng)站提供了開(kāi)發(fā)者API，地址傳送門(mén)：(https://developer.github.com/v3/)，基于vuejs，對(duì)初中級(jí)前端同學(xué)有所幫助，對(duì)于初中級(jí)前端同學(xué)同學(xué)來(lái)說(shuō)是一個(gè)不錯(cuò)的一個(gè)參考項(xiàng)目。

總結(jié)

以上是生活随笔為你收集整理的vue 可视化布局工具_GitDataV一款Github的'大数据可视化平台'的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。