用途:vue-data-ui 是一个 Vue 3 数据可视化组件库,包含 69 个组件,用于图表化数据叙事。文档按组件分页,仓库地址为 github.com/graphieros/vue-data-ui,当前版本 vue-data-ui@3.25.9。
主要能力:每个组件接收 dataset 与 config 两个 prop;config 可传部分配置并自动与默认值合并,建议用 computed 包裹以保持响应式。类型随包提供,主入口类型解析到 dist/types/vue-data-ui.d.ts。可通过模板 ref 调用组件暴露的方法,如 getData、getImage({ scale: 2 })、showSeries/hideSeries。工具提示可用 tooltip.customFormat 或 #tooltip-before/#tooltip-after 插槽定制,数据标签用 formatter 格式化。支持 SSR 静态 SVG 渲染(createStaticVueUiXy,可选 vue-data-ui/ssr/vue-ui-xy 以 tree-shaking)。
使用方式:安装 npm i vue-data-ui,引入组件并必须引入 "vue-data-ui/style.css"。可从 vue-data-ui 导入 getVueDataUiConfig、mergeConfigs 及类型;未由主入口再导出的工具从 vue-data-ui/utils 导入。PDF 导出需可选 peer 依赖 jspdf>=3.0.1。
适用场景:需要图表、提示、导出、SSR 与大数据的 Vue 3 项目。
限制:需 vue>=3.3.0。大数据集建议用 VueUiXyCanvas 替代 VueUiXy,并调整 config.downsample.threshold;默认阈值为 Xy 1095、XyCanvas 10000、Quadrant/Scatter/Sparkline/SparkTrend 1095。开启 config.responsive 时容器须有固定尺寸。指针光标默认关闭。v3.25.0 为破坏性变更:showOnlyAtModulo 改为真实取模且默认值由 12 变为 2,新增 showFirstAndLast。VueUiXy 中条形序列不可与连续 { x, y } 序列混用。v3.14.3 起移除 locale 文件,时间标签依赖 Intl。v3 相对 v2 非破坏性,但部分 padding 配置有变。更多 API 与迁移细节见官方文档及迁移说明。