# 堆叠条形图生成器

生成交互式堆叠条形图来可视化分类数据组成，非常适合跨类别比较多个数据系列

> 标准页面: https://elysiatools.com/zh/tools/stacked-bar-chart

- **分类:** Data Visualization

- **关键词:** 堆叠条形图, 比较图表, 数据组成, 分类数据, 多系列, 百分比图表, 数据可视化

## 概述

堆叠条形图生成器是一款在线数据可视化工具，能将您提供的分类数据快速转换为清晰、交互式的堆叠条形图。它直观展示各组成部分在整体中的占比，非常适合比较不同类别下多个数据系列的构成情况。

## 输入项

- **图表数据** (textarea): 堆叠条形图的JSON格式数据，包含分类、系列和数值字段
- **图表标题** (text): 显示在图表上方的标题
- **配色方案** (select): 选择配色方案
- **自定义颜色** (textarea): 十六进制颜色JSON数组（需要选择自定义颜色）
- **数值格式** (select): 选择数值格式
- **图表高度** (number): 图表的像素高度（最小：300，最大：800）
- **条形间距** (number): 条形之间的间距（0.1 - 0.5）
- **背景颜色** (color): 图表容器的背景颜色
- **在条形上显示数值** (checkbox): 在条形上显示数值或百分比
- **显示图例** (checkbox): 显示系列的颜色图例
- **显示网格线** (checkbox): 显示水平网格线
- **显示动画** (checkbox): 图表加载时动画显示条形
- **显示百分比** (checkbox): 在条形上显示百分比而不是数值
- **启用工具提示** (checkbox): 悬停时显示详细信息

## 适用场景

- 需要比较不同类别（如季度、地区、部门）中多个组成部分（如产品线、成本项、来源渠道）的数值或占比时。
- 希望直观展示数据构成随时间或条件变化的趋势时。
- 需要快速生成专业、可交互的图表用于报告、演示或网页嵌入时。

## 工作原理

- 在“图表数据”文本框中，按照指定的JSON格式输入您的分类、系列和数值数据。
- 根据需要配置图表标题、配色方案、数值格式、高度等外观选项。
- 点击生成按钮，工具将立即渲染出交互式堆叠条形图，支持悬停查看详情。
- 您可以直接在页面上查看图表，或通过浏览器功能将其保存为图片。

## 使用案例

- 市场分析：比较不同市场区域中各产品线的销售额构成。
- 销售报告：展示各销售团队在不同季度完成的业绩占比。
- 项目管理：可视化各项目阶段中不同资源类型（人力、物料、时间）的投入分布。

## 常见问题

### 输入的数据格式有什么要求？

数据必须为JSON数组格式，每个对象需包含“category”（分类）、“series”（系列）和“value”（数值）三个字段。

### 生成的图表是静态图片还是交互式的？

生成的是交互式HTML图表。您可以将鼠标悬停在条形上查看具体数值，并可通过浏览器缩放功能调整视图。

### 可以自定义图表的颜色吗？

可以。您可以从预设的配色方案中选择，或在选择“自定义颜色”后，输入十六进制颜色代码数组来完全自定义系列颜色。

### 如何将图表用于我的报告或网站？

生成后，您可以使用浏览器的“另存为”功能将整个页面保存为HTML文件，或使用截图工具将图表区域保存为PNG/JPG图片。

### 这个工具是免费的吗？

是的，这是一个完全免费的在线工具，无需注册即可使用所有功能。

## 相关工具

- [柱状图生成器](https://elysiatools.com/zh/tools/bar-chart-generator): 从数据生成可自定义的柱状图，支持多种样式选项
- [气泡图生成器](https://elysiatools.com/zh/tools/bubble-chart-generator): 从数据生成可自定义的气泡图，支持三个维度（X、Y、大小）的可视化
- [环形图生成器](https://elysiatools.com/zh/tools/donut-chart-generator): 从数据生成可自定义的环形图（甜甜圈图），具有中央空间，非常适合显示比例数据
- [漏斗图生成器](https://elysiatools.com/zh/tools/funnel-chart-generator): 从数据生成可自定义的漏斗图，非常适合显示转化率、销售管道和流程
- [仪表盘图生成器](https://elysiatools.com/zh/tools/gauge-chart-generator): 从数据生成可自定义的仪表盘图（速度计图），非常适合显示KPI、指标和性能数据
- [热力图生成器](https://elysiatools.com/zh/tools/heatmap-generator): 从数据生成可自定义的热力图，非常适合可视化数据密度、相关性和模式
- [象形图生成器](https://elysiatools.com/zh/tools/pictograph-generator): 使用图标/符号创建象形图来表示数量，支持自定义图标、颜色和布局
- [饼图生成器](https://elysiatools.com/zh/tools/pie-chart-generator): 从数据生成可自定义的饼图，支持多种样式选项

## 示例

- [Grafana 高级应用示例](https://elysiatools.com/zh/samples/grafana-samples): 全面的 Grafana 示例，涵盖高级仪表板设计、告警配置、数据源集成和插件开发
- [D3.js 数据可视化示例](https://elysiatools.com/zh/samples/d3js-data-visualization): 全面的D3.js数据可视化示例，包括图表、地图、动画和交互式可视化
- [二维码示例](https://elysiatools.com/zh/samples/qrcode-samples): 用于测试二维码读取和生成工具的示例二维码图像
- [ELK Stack 日志分析示例](https://elysiatools.com/zh/samples/elk-stack-samples): 全面的 ELK Stack（Elasticsearch、Logstash、Kibana）示例，用于分布式系统中的日志聚合、处理和可视化

## 相关内容

- [图表与示意图生成器](https://elysiatools.com/zh/hubs/chart-diagram-generators): 在一个可视化页面里用你自己的数据生成柱状图、折线图、饼图、环形图、散点图、雷达图、甘特图、桑基图、热力图、漏斗图、树状图等数十种图表与示意图。
- [JSON 交换与格式翻译工具](https://elysiatools.com/zh/hubs/json-convert): 在一个专题里比较 JSON 与 CSV、YAML、TOML、GraphQL、XML、Markdown、Excel、BSON、EDN 等结构化格式之间的转换工具。
- [JSON 检查、对比与转换工具](https://elysiatools.com/zh/hubs/json-utility): 把 JSON 格式化、差异对比、路径检查、Schema 校验、合并、转换和导出工具集中到一个专题中，适合 API 与数据处理流程。
- [JSON Schema、Mock 数据与 API 夹具生成工具](https://elysiatools.com/zh/hubs/json-generate): 围绕JSON Schema 生成、Mock 负载构建与 API 夹具准备整理的一组工具。