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

Vs 概述

Vs 是一个基于 d3.js 和 vue.js 的数据可视化分析包，适用于图表，dashboard 制作。

Github Repo

目前支持的组件

• d3Bar
• d3Line
• d3Pie
• d3ProgressArc
• d3SankeyCircular
• d3Timelion
• d3Timeline

主依赖

• d3.js v4
• vue.js v2.5

安装

npm i -S GopherJ/Vs

使用

建议使用 vue-cli 搭建环境，以下只针对标准 vue.js 环境。

main.js

import Vs from 'Vs';

Vue.use(Vs);

template

// 水平柱状图


// 圆饼图 或者 甜甜圈


// 曲线图


// 垂直柱状图


// Sankey 图，详见
// https://github.com/d3/d3-sankey


// 时间轴图


// 仿 kibana timelion

注意：以上均使用默认配置，柱状图，圆饼图或者甜甜圈图都默认需要传入元素为 { key: key, value: value} 类型的数组。Sankey 图及其他图标支持的数据类型请见项目主页。

预览

https://gopherj.github.io/Vs/#/

文档

https://github.com/GopherJ/Vs

部分截图

最后

如果你有任何建议或者其他希望也在未来支持的图表请提 issue 或者邮件，[email protected]，喜欢请 star，谢谢支持！