2019-07-31 10:09:35 +08:00
|
|
|
|
[ENGLISH](./README_EN.md)
|
2019-07-05 16:17:52 +08:00
|
|
|
|
|
2019-06-25 19:57:04 +08:00
|
|
|
|
<h1 align="center">DataV</h1>
|
|
|
|
|
<p align="center">
|
2019-10-22 11:44:56 +08:00
|
|
|
|
<a href="https://github.com/DataV-Team/datav/blob/master/LICENSE">
|
2019-10-22 11:38:17 +08:00
|
|
|
|
<img src="https://img.shields.io/github/license/DataV-Team/datav.svg" alt="LICENSE" />
|
2019-10-22 13:52:58 +08:00
|
|
|
|
</a>
|
2019-07-05 16:25:54 +08:00
|
|
|
|
<a href="https://www.npmjs.com/package/@jiaminghi/data-view">
|
2019-06-25 19:57:04 +08:00
|
|
|
|
<img src="https://img.shields.io/npm/v/@jiaminghi/data-view.svg" alt="LICENSE" />
|
|
|
|
|
</a>
|
|
|
|
|
</p>
|
2018-12-04 11:43:18 +08:00
|
|
|
|
|
2019-07-31 10:09:35 +08:00
|
|
|
|
## DataV是干什么的?
|
2019-07-05 16:17:52 +08:00
|
|
|
|
|
2019-09-25 12:11:21 +08:00
|
|
|
|
* DataV是一个基于**Vue**的数据可视化组件库(当然也有[React版本](https://github.com/DataV-Team/DataV-React))
|
2019-09-10 15:10:02 +08:00
|
|
|
|
* 提供用于提升页面视觉效果的**SVG**边框和装饰
|
|
|
|
|
* 提供常用的**图表**如折线图等
|
|
|
|
|
* 飞线图/轮播表等其他组件
|
2018-12-04 11:43:18 +08:00
|
|
|
|
|
2019-07-31 10:09:35 +08:00
|
|
|
|
### npm安装
|
2018-12-04 11:43:18 +08:00
|
|
|
|
|
2019-06-25 19:57:04 +08:00
|
|
|
|
```shell
|
|
|
|
|
$ npm install @jiaminghi/data-view
|
|
|
|
|
```
|
2018-12-04 11:43:18 +08:00
|
|
|
|
|
2019-07-31 10:09:35 +08:00
|
|
|
|
### 使用
|
2019-07-05 16:17:52 +08:00
|
|
|
|
|
|
|
|
|
```js
|
|
|
|
|
import Vue from 'vue'
|
|
|
|
|
import DataV from '@jiaminghi/data-view'
|
|
|
|
|
|
|
|
|
|
Vue.use(DataV)
|
|
|
|
|
|
2019-07-31 10:09:35 +08:00
|
|
|
|
// 按需引入
|
2019-07-05 16:17:52 +08:00
|
|
|
|
import { borderBox1 } from '@jiaminghi/data-view'
|
|
|
|
|
Vue.use(borderBox1)
|
|
|
|
|
```
|
|
|
|
|
|
2019-08-27 18:33:14 +08:00
|
|
|
|
详细文档及示例请移步[HomePage](http://datav.jiaminghi.com).
|
|
|
|
|
|
2019-09-10 15:10:02 +08:00
|
|
|
|
### UMD版
|
|
|
|
|
|
2019-09-10 15:32:42 +08:00
|
|
|
|
`UMD`版可直接使用`script`标签引入,`UMD`版文件位于项目`dist`目录下,引入后将自动把所有组件注册为**Vue全局组件**,引入`DataV`前请确保已引入`Vue`。
|
2019-09-10 15:10:02 +08:00
|
|
|
|
|
|
|
|
|
[UMD版使用示例](./umdExample.html)
|
|
|
|
|
|
2019-09-06 10:59:55 +08:00
|
|
|
|
### 调研
|
|
|
|
|
|
|
|
|
|
关于React版本组件库及反馈请移步[问卷调查](https://www.wjx.cn/jq/45326197.aspx)
|
|
|
|
|
|
2019-09-10 15:10:02 +08:00
|
|
|
|
![问卷调查](./questionnaire.jpg)
|
2019-09-06 10:59:55 +08:00
|
|
|
|
|
2019-09-02 14:17:07 +08:00
|
|
|
|
### TODO
|
|
|
|
|
|
2019-09-05 11:55:25 +08:00
|
|
|
|
* **飞线图**添加多中心点及反向飞线功能
|
2019-09-02 14:17:07 +08:00
|
|
|
|
* **边框**及**装饰**添加颜色及其他必要配置项,增强可配置性及灵活性.
|
|
|
|
|
|
2019-09-04 08:54:48 +08:00
|
|
|
|
### 致谢
|
|
|
|
|
|
2019-10-22 11:43:15 +08:00
|
|
|
|
组件库的开发基于个人学习和兴趣,由于技术水平及经验的限制,组件尚有许多不完善之处,如有BUG可及时提交[issue](https://github.com/DataV-Team/DataV/issues/new?template=bug_report.md)或添加反馈群进行反馈,也欢迎提供指正和建议,感谢各位的支持。
|
2019-09-04 08:54:48 +08:00
|
|
|
|
|
2019-09-04 09:04:33 +08:00
|
|
|
|
### 反馈
|
|
|
|
|
|
|
|
|
|
![Feedback](./QQGroup.png)
|
|
|
|
|
|
2019-08-27 18:33:14 +08:00
|
|
|
|
### Demo
|
|
|
|
|
|
2019-08-27 18:38:18 +08:00
|
|
|
|
Demo页面使用了全屏组件,请F11全屏后查看。
|
|
|
|
|
|
2019-08-27 18:42:33 +08:00
|
|
|
|
* [施工养护综合数据](http://datav.jiaminghi.com/demo/construction-data/index.html)
|
2019-08-27 18:33:14 +08:00
|
|
|
|
|
|
|
|
|
![construction-data](./demoImg/construction-data.jpg)
|
|
|
|
|
|
2019-08-27 18:42:33 +08:00
|
|
|
|
* [机电运维管理台](http://datav.jiaminghi.com/demo/manage-desk/index.html)
|
2019-08-27 18:33:14 +08:00
|
|
|
|
|
|
|
|
|
![manage-desk](./demoImg/manage-desk.jpg)
|
2019-08-30 12:53:31 +08:00
|
|
|
|
|
|
|
|
|
* [机电设备电子档案](http://datav.jiaminghi.com/demo/electronic-file/index.html)
|
|
|
|
|
|
|
|
|
|
![electronic-file](./demoImg/electronic-file.jpg)
|