面积图制作
📥 导出设置
💡 提示:所有图表均在浏览器本地生成,保护您的隐私安全。
👁️ 实时预览
🎨 图表样式配置
{{ chartConfig.chartWidth }}px
{{ chartConfig.chartHeight }}px
{{ chartConfig.chartHAlign }}%
{{ chartConfig.chartVAlign }}%
{{ chartConfig.areaOpacity }}%
{{ chartConfig.lineWidth }}px
{{ chartConfig.pointRadius }}px
提示:每条序列的颜色可在"数据编辑"中单独设置,点击下方颜色主题可一键套用到全部序列。
{{ chartConfig.titleAlign }}%
{{ chartConfig.titleVertical }}%
{{ chartConfig.titleFontSize }}px
{{ chartConfig.subtitleFontSize }}px
{{ chartConfig.xAxisFontSize }}px
{{ chartConfig.yAxisFontSize }}px
{{ chartConfig.xAxisRotate }}°
{{ chartConfig.xAxisLabelMax === 0 ? '不截断' : chartConfig.xAxisLabelMax + '字' }}
{{ chartConfig.yAxisTicks }}
{{ chartConfig.gridOpacity }}%
{{ chartConfig.labelFontSize }}px
{{ chartConfig.labelDecimals }}
{{ chartConfig.legendFontSize }}px
{{ chartConfig.watermarkFontSize }}px
{{ chartConfig.watermarkOpacity }}%
{{ chartConfig.watermarkDensity }}
{{ chartConfig.watermarkAngle }}°
{{ chartConfig.sourceFontSize }}px
{{ chartConfig.sourceX }}%
{{ chartConfig.sourceY }}%
{{ chartConfig.authorFontSize }}px
{{ chartConfig.authorX }}%
{{ chartConfig.authorY }}%
📝 数据编辑
📊 数据编辑(Handsontable 类 Excel 表格)
提示:可直接粘贴 Excel 数据;右键行号/列头可插入或删除行列;第一列为颜色,第二列为序号,第三列为序列名称,第一行为类别名称。点击颜色方块可修改序列颜色。
💡 功能说明
面积图制作是一款在浏览器本地运行的图表生成工具。只需填入各项标签与数值,即可实时生成清晰直观的面积统计图,全程在本地完成、无需上传服务器,既高效又保护数据隐私。面积图在折线的下方填充颜色,既能展示数值随时间或类别的变化趋势,又能直观体现各数据点的累计体量,特别适合展示销售走势、流量变化、占比演化等连续数据。无论是月度销售汇报、用户增长分析还是调研趋势整理,都能一键生成并导出精美图表。
- 实时预览:数据、颜色、标题、坐标轴、图例等所有改动即时反映在预览区,所见即所得。
- 样式丰富:支持图表尺寸、面积填充透明度、平滑曲线、描边线、数据点、渐变填充等多种样式自定义。
- 坐标轴与网格:可分别控制 X 轴与 Y 轴的显示、颜色、字号,支持标签旋转、自定义 Y 轴最大值与刻度数量,网格支持实线、虚线、点线三种样式。
- 数值标注:支持在数据点旁(顶部、居中、底部)标注数值,并可设置字号、颜色与小数位数。
- 自定义配色:内置多套配色主题一键套用到全部序列,每条序列也可在"数据编辑"中单独设置颜色。
- 多序列 / 堆叠:支持添加多条数据序列,可切换"堆叠面积图"模式,直观展示累计体量或分序列对比。
- 水印与导出:支持添加水印保护图表;可复制图片到剪贴板,或导出为 PNG、JPG、SVG 格式。
⚠️ 注意事项
- 序列与类别均可自由增减,类别过多时建议开启"堆叠面积图"或调整图表宽度,避免数据点过于密集。
- 数值为 0 的序列不会绘制面积,但仍有颜色的序列会正常显示。
- Y 轴最大值/最小值留空或设为 0 时会自动根据数据取合适的刻度范围;如需固定刻度可手动填写,设置最小值可放大波动细节。
- X 轴标签文字较长时,可调整"X 轴标签旋转"角度或设置"X 轴标签最大字符数"进行省略,避免文字相互重叠。
- 页面数据会自动保存在本地浏览器,下次打开可继续编辑;点击"清空"将同时清除本地存储。
- 导出 PNG / JPG 为位图,放大后可能模糊;如需无损缩放请选择 SVG 格式。