《开源精选》是我们分享Github、Gitee等开源社区中优质项目的栏目,包括技术、学习、实用与各种有趣的内容。本期推荐的是一个中Vue 大屏数据展示组件库——DataV。
DataV是一个基于Vue数据可视化组件库,主要用于大屏数据展示,提供SVG的边框及装饰、图表、水位图、飞线图等组件,简单易用,长期更新。目前React版本已经发布。
安装使用
npm安装
$ npm install @jiaminghi/data-view
使用
// 将自动注册所有组件为全局组件
import dataV from '@jiaminghi/data-view'
Vue.use(dataV)
按需引入
按需引入仅支持基于ES module的tree shaking,按需引入示例如下:
import { borderBox1 } from '@jiaminghi/data-view'
Vue.use(borderBox1)
组件
全屏容器
数据可视化页面一般在浏览器中进行全屏展示,全屏容器将根据屏幕比例及当前浏览器窗口大小,自动进行缩放处理。浏览器全屏后,全屏容器将充满屏幕。