svg-art

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

SVG Art: Programmatic Generation

SVG图形：程序化生成

Generate high-quality SVG graphics using Python scripts. All scripts output valid SVG to stdout (or file with

-o

使用Python脚本生成高质量SVG图形。所有脚本都会将有效的SVG输出到标准输出（或通过

-o

参数输出到文件）。

Available Scripts

可用脚本

Script	Purpose	Key Options
`generate_grid.py`	Grid patterns	`--cols` , `--rows` , `--shape` , `--vary-*`
`generate_radial.py`	Radial/spiral/sunburst	`--spiral` , `--concentric` , `--sunburst`
`generate_fractal.py`	Fractals (tree, koch, sierpinski)	`--tree` , `--koch` , `--sierpinski` , `--depth`
`generate_wave.py`	Waves and audio viz	`--layers` , `--noise` , `--bars`
`generate_particles.py`	Scatter/cluster/constellation	`--cluster` , `--gradient` , `--constellation`
`generate_chart.py`	Data visualization	`--bar` , `--line` , `--pie` , `--donut`
`generate_icon.py`	Common UI icons	`--icon NAME` , `--list` , `--filled`
`optimize_svg.py`	Minify/optimize SVG	`--aggressive` , `--stats`

脚本	用途	主要选项
`generate_grid.py`	网格图案	`--cols` , `--rows` , `--shape` , `--vary-*`
`generate_radial.py`	放射状/螺旋/旭日形图案	`--spiral` , `--concentric` , `--sunburst`
`generate_fractal.py`	分形图形（树、科赫曲线、谢尔宾斯基三角形）	`--tree` , `--koch` , `--sierpinski` , `--depth`
`generate_wave.py`	波浪与音频可视化	`--layers` , `--noise` , `--bars`
`generate_particles.py`	散点/集群/星群图案	`--cluster` , `--gradient` , `--constellation`
`generate_chart.py`	数据可视化图表	`--bar` , `--line` , `--pie` , `--donut`
`generate_icon.py`	通用UI图标	`--icon NAME` , `--list` , `--filled`
`optimize_svg.py`	SVG压缩/优化	`--aggressive` , `--stats`

Quick Examples

快速示例

bash

undefined

bash

undefined

Grid with size variation

带尺寸变化的网格

python scripts/generate_grid.py -c 6 -r 6 --vary-size --vary-opacity -o grid.svg

Spiral pattern

螺旋图案

python scripts/generate_radial.py --spiral -n 60 --turns 4 -o spiral.svg

Fractal tree

分形树

python scripts/generate_fractal.py --tree --depth 8 --vary-angle -o tree.svg

Layered waves with fill

带填充的分层波浪

python scripts/generate_wave.py --layers 5 --fill -o waves.svg

Constellation network

星群网络图案

python scripts/generate_particles.py --constellation -n 30 --connect-distance 25 -o network.svg

Bar chart

柱状图

python scripts/generate_chart.py --bar --data "30,50,80,45,90" --labels "A,B,C,D,E" -o chart.svg

Heart icon

心形图标

python scripts/generate_icon.py --icon heart --filled --stroke "#E11D48" -o heart.svg

Optimize existing SVG

优化现有SVG

python scripts/optimize_svg.py input.svg --aggressive -o output.svg

undefined

python scripts/optimize_svg.py input.svg --aggressive -o output.svg

undefined

Script Usage Patterns

脚本使用模式

Grid Patterns

网格图案

bash

python scripts/generate_grid.py \
  -c 8 -r 8           # columns and rows
  -s 10 -g 2          # size and gap
  --shape circle      # rect, circle, or diamond
  --vary-size         # random size variation
  --vary-opacity      # random opacity
  --vary-hue          # color variation
  --seed 42           # reproducible randomness

bash

python scripts/generate_grid.py \
  -c 8 -r 8           # 列数和行数
  -s 10 -g 2          # 尺寸和间距
  --shape circle      # 形状：rect（矩形）、circle（圆形）或diamond（菱形）
  --vary-size         # 随机尺寸变化
  --vary-opacity      # 随机透明度
  --vary-hue          # 颜色变化
  --seed 42           # 可复现的随机效果

Radial Patterns

放射状图案

bash

undefined

bash

undefined

Concentric rings

同心环

python scripts/generate_radial.py --concentric --rings 5 --vary-hue

Sunburst rays

旭日形射线

python scripts/generate_radial.py --sunburst -n 24 --vary-length

undefined

python scripts/generate_radial.py --sunburst -n 24 --vary-length

undefined

Fractals

分形图形

bash

undefined

bash

undefined

Koch snowflake

科赫雪花

python scripts/generate_fractal.py --koch --depth 4 --fill "#3B82F6"

Sierpinski triangle

谢尔宾斯基三角形

python scripts/generate_fractal.py --sierpinski --depth 5

undefined

python scripts/generate_fractal.py --sierpinski --depth 5

undefined

Charts

图表

bash

undefined

bash

undefined

Line chart with points

带数据点的折线图

python scripts/generate_chart.py --line --data "10,30,20,50" --show-points --smooth

Donut chart

环形图

python scripts/generate_chart.py --donut --data "40,30,20,10" --labels "A,B,C,D"

undefined

python scripts/generate_chart.py --donut --data "40,30,20,10" --labels "A,B,C,D"

undefined

Icons

图标

bash

undefined

bash

undefined

List all available icons

列出所有可用图标

python scripts/generate_icon.py --list

Common icons: check, x, plus, menu, search, home, user, settings,

常用图标：check（勾选）、x（叉号）、plus（加号）、menu（菜单）、search（搜索）、home（首页）、user（用户）、settings（设置）、

mail, heart, star, play, file, download, edit, share, sun, moon, etc.

mail（邮件）、heart（心形）、star（星星）、play（播放）、file（文件）、download（下载）、edit（编辑）、share（分享）、sun（太阳）、moon（月亮）等。

undefined

undefined

Common Options (All Scripts)

所有脚本通用选项

```
--fill COLOR
```
: Fill color (default: #3B82F6)
```
--stroke COLOR
```
: Stroke color
```
--stroke-width N
```
: Stroke width
```
--seed N
```
: Random seed for reproducibility
```
-o FILE
```
: Output to file instead of stdout

```
--fill COLOR
```
: 填充颜色（默认值：#3B82F6）
```
--stroke COLOR
```
: 描边颜色
```
--stroke-width N
```
: 描边宽度
```
--seed N
```
: 随机种子，用于复现效果
```
-o FILE
```
: 将输出写入文件而非标准输出

Piping and Composition

管道与组合使用

Scripts can be piped together:

bash

undefined

脚本可通过管道组合使用：

bash

undefined

Generate and optimize

生成并优化SVG

python scripts/generate_grid.py -c 10 -r 10 | python scripts/optimize_svg.py --aggressive

Check optimization stats

查看优化统计信息

python scripts/generate_fractal.py --tree --depth 10 | python scripts/optimize_svg.py --stats

undefined

python scripts/generate_fractal.py --tree --depth 10 | python scripts/optimize_svg.py --stats

undefined

SVG Fundamentals Reference

SVG基础知识参考

See references/svg-fundamentals.md for:

Core SVG structure and viewBox
Element types (rect, circle, path, etc.)
Path command syntax
Gradients and patterns
Accessibility requirements

请查看references/svg-fundamentals.md了解：

SVG核心结构与viewBox
元素类型（rect、circle、path等）
路径命令语法
渐变与图案
无障碍访问要求