水球图

波浪球展示百分比：完成率、达成率、使用率。填一个 0-100 的数，球就会涨到那。

在线水球图工具介绍

水球图在线生成工具，用带波浪动画的球形呈现百分比进度，比干巴巴的数字生动得多，是完成率、达成率、使用率、剩余空间等百分比指标的高颜值展示方案，常见于运营大屏、周报封面和活动页面。粘贴「名称 + 百分比数值」即可生成，波面自带双色动画，导出 PNG / SVG。本地处理，数据不上传。

主要功能

  • 双色波浪动画，进度感与颜值兼备
  • 中心显示百分比与指标名称
  • 数值自动限制在 0-100 区间
  • 一个数值即出图，支持导出 PNG / SVG
  • 本地渲染，数据不出浏览器

使用方法

  1. 整理两列数据：指标名称 + 百分比数值
  2. 粘贴或上传后选择名称列与数值列
  3. 生成水球图，波浪自动流动
  4. 按需修改标题
  5. 导出 PNG / SVG 用于大屏或周报

常见问题

导出的图有动画吗？
导出 PNG / SVG 是静态帧，波浪位置为导出瞬间的状态。需要在网页中展示动画时，可直接复制 ECharts 配置嵌入自己的页面。
数值 120 会怎样？
水球按 0-100 渲染，超过 100 会被限制在满球状态。展示超目标完成建议改用仪表盘或大数字。
可以改波浪颜色吗？
默认使用主题青绿色。需要品牌色时，复制 ECharts 配置修改 series 的 color 数组即可。

注意事项

  • 数值列取第一行数据，多行数据请先精简
  • 百分比直接填数字（67 代表 67%），无需带 % 号
  • 小数值低于 10% 时波浪起伏不明显，属正常
  • 动画依赖 canvas 渲染，截屏分享请用导出功能