# VUE_dataVisualization

**Repository Path**: tylermeek/vue_data-visualization

## Basic Information

- **Project Name**: VUE_dataVisualization
- **Description**: vue2 data visualization
- **Primary Language**: 其他
- **License**: MulanPSL-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-09-16
- **Last Updated**: 2022-10-12

## Categories & Tags

**Categories**: Uncategorized

**Tags**: Vue, Vuex

## README

# 个人实战项目 -- 大数据可视化看板平台 vue_data-visualization

## 前端技术栈：
```
    vue2、vuex、vue-router、axios、echarts、websocket
```
## 简介：
```
    该项目主要利用vue进行前端开发，使用echarts库实现利用柱状图、饼图、折线图、地图展示数据
    利用websocket进行后端数据获取并实现多端联动的主题切换和切换全屏。
```
## 主要实现功能：
```
    1.销量趋势折线图表、商家销售金额柱状图图表、商家分布地图图表、地区销量排行柱状图表、
    热销商品占比饼图图表、库存销量分析饼状图表的数据展示
    2.数据的动态展示，即图表的动态更新数据，避免图表大小的不足导致无法完全展示数据
    3.多端联动的黑白主题切换、图表的全屏展示切换
    4.动态适配分辨率
```

## 项目规划：
```
    1.0版本 待优化：
         1.echart的按需引入封装，改造组件 [√]
         2.header栏的优化，主要有时间的实时更新，title的样式优化，分辨率适配 [√]
         3.优化ui [√]
             1.加载动画 [√]
             2.销量趋势选择栏优化 [√]

    2.0版本：
        实现在线编辑功能，即更改数据，或者是更改图形类型
            具体细节:
                1.使用elementui的修改框，居中显示
                2.因为涉及数据修改，所以需要增加登录鉴权
                3.网站可以应该直接进入展示页面，但是需要修改的时候才进行鉴权
                    如果未登录则跳转登录page
                    如果登录了直接弹修改框
            业务流程：
                见下图
                https://www.yuque.com/u21265242/nozban/aq5o0a?inner=I1PgF

    3.0版本 
        进一步改变产品本身定位，变成工具类产品，即快捷生成可视化图表工具
```

## Project setup
```
npm install
```

### Compiles and hot-reloads for development
```
npm run serve
```

### Compiles and minifies for production
```
npm run build
```

### Lints and fixes files
```
npm run lint
```

### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).