数据图表可视化设计
将以下提示词粘贴到你的 AI 对话框中:
请根据 https://skillhub.cn/install/skillhub.md,安装 @user_fccf428b/chart-designer。
技能介绍
解决什么问题
当数据量不小,但真正要传达的结论很具体时,常见问题不是“有没有图”,而是图型选择错误:用饼图塞太多类别、用折线图比较离散项目、用仪表图堆多个 KPI,或者配置在 ECharts、Chart.js、Excel 之间来回手改。Chart Designer 把图表设计当成一组可检查的决策:先判断数据关系、受众和展示位置,再给出图型、配置与样式建议。
它如何工作
核心能力包括:
- 推荐图型:比较、趋势、分布、占比、流向、KPI 等场景对应
bar、line、histogram、treemap、sankey、gauge等。 - 生成配置:输出
ECharts JSON、Chart.js配置、Excel 图表说明,以及 CSS/配色建议。 - 设计规范:按 data-ink ratio、轴单位、颜色数量、无障碍配色、tooltip/zoom/drill-down 等检查图表是否清晰。
关键步骤通常是从数据描述开始:说明字段类型、想回答的问题、受众(技术、管理层、公众)和展示位置(报告、看板、演示)。随后得到候选图型、配置选项、布局与配色,最后拿到可复制到工具中的配置草稿。这个流程适合需要快速把分析结果变成可评审图表草案,而不是只给一句“做个折线图”的场景。
适用边界
它不直接渲染图表,也不会自动访问或处理你的数据源。复杂自定义图型、实时数据接入、部署到特定前端框架,仍需要工程侧完成。生成的配置是起点,可能需要按具体版本、主题和业务字段做调整。若目标只是生成静态图片,应把它视为图表规格说明,而不是成品渲染器。
使用场景
- 分析月度业务指标时,把类别比较与同环比趋势拆成两组图,并生成 ECharts JSON 草稿。
- 开发管理后台时,为 KPI、趋势和占比分别选定图型,并输出 Chart.js 配置与配色建议。
- 准备汇报材料时,把用户转化漏斗与地区占比改成漏斗图和树图,并生成 Excel 图表说明。
- 复盘季度报告时,检查折线图轴单位、颜色数量和布局,并给出可粘贴的样式修改建议。
适合人员
- 准备月度经营分析的数据分析师,需要把类别比较与趋势拆成可评审的 ECharts 配置。
- 开发管理后台的前端工程师,需要按 KPI、趋势、占比生成 Chart.js 配置。
- 制作汇报材料的产品运营,需要把漏斗、占比和 KPI 转成图表规格。
- 维护季度复盘的分析支持,需要检查图表轴单位、颜色数量与配色可访问性。