Vs - 基于 d3.js 和 vue.js 的数据可视化

### Vs 概述 > Vs 是一个基于 `d3.js` 和 `vue.js` 的数据可视化分析包，适用于图表，dashboard 制作。 [Github Repo](https://github.com/GopherJ/Vs) ### 目前支持的组件 - `d3Bar` - `d3Line` - `d3Pie` - `d3ProgressArc` - `d3SankeyCircular` - `d3Timelion` - `d3Timeline` ### 主依赖 - `d3.js v4` - `vue.js v2.5` ### 安装 ```javascript npm i -S GopherJ/Vs ``` ### 使用 > 建议使用 `vue-cli` 搭建环境，以下只针对标准 `vue.js` 环境。 `main.js` ``` import Vs from 'Vs'; Vue.use(Vs); ``` `template` ``` // 水平柱状图 <d3-bar :data="data"></d3-bar> // 圆饼图 或者 甜甜圈 <d3-pie :data="data"></d3-pie> // 曲线图 <d3-line :data="data"></d3-line> // 垂直柱状图 <d3-bar :data="data" :options="{ isVertical: true }"></d3-bar> // Sankey 图，详见 // https://github.com/d3/d3-sankey <d3-sankey-circular v-bind="dataSankey"></d3-sankey-circular> // 时间轴图 <d3-timeline :data="dataTimeline"></d3-timeline> // 仿 kibana timelion <d3-timelion :data="dataTimelion"></d3-timelion> ``` > 注意：以上均使用默认配置，柱状图，圆饼图或者甜甜圈图都默认需要传入元素为 `{ key: key, value: value}` 类型的数组。Sankey 图及其他图标支持的数据类型请见项目主页。 ### 预览 https://gopherj.github.io/Vs/#/ ### 文档 https://github.com/GopherJ/Vs ### 部分截图    ### 最后 如果你有任何建议或者其他希望也在未来支持的图表请提 `issue` 或者邮件，`cocathecafe@gmail.com`，喜欢请 `star`，谢谢支持！