SVG 知识地图

模块知识结构与学习路径 | 18 篇文档 | 19 个节点 | 46 条关系

正在加载知识地图...

文档索引

SVG 概述与环境配置SVG 发展历程、核心特性、与 Canvas/位图对比、嵌入方式与开发环境。
SVG 基础语法与文档结构svg 根元素、命名空间、defs/metadata/title、嵌套与分组。
SVG 坐标系与 viewBox视口、viewBox、preserveAspectRatio、坐标系变换原理与适配技巧。
SVG 基本图形详解rect、circle、ellipse、line、polyline、polygon 六大基本图形属性与用法。
SVG 路径 path 详解path 命令、贝塞尔曲线、弧线、相对坐标与复杂路径绘制技巧。
SVG 文本与排版text、tspan、textPath、文字锚点、字体属性与可访问文本。
SVG 颜色与填充fill、stroke、opacity、currentColor、paint-order 与矢量效果。
SVG 渐变与图案linearGradient、radialGradient、pattern 平铺与复杂纹理。
SVG 变换 transformtranslate、rotate、scale、skew、matrix 与 transform-origin 变换组合。
SVG 滤镜详解filter、feGaussianBlur、feDropShadow、feColorMatrix、滤镜组合与光照。
SVG 裁剪与蒙版clipPath 硬裁剪、mask 软蒙版、 luminance 与 alpha 蒙版技巧。
SVG 符号与复用symbol、use、defs 复用机制与图标系统构建。
SVG 动画基础SMIL animate、animateTransform、animateMotion 与 CSS 动画对比。
SVG CSS 样式化内联样式、style 标签、外部 CSS、CSS 变量、伪类与媒体查询。
SVG JavaScript 交互DOM 操作、事件绑定、属性读写、动态生成与数据驱动可视化。
SVG 响应式与性能响应式适配、性能瓶颈、优化策略、懒加载与压缩。
SVG 图标与可访问性图标系统设计、aria 属性、屏幕阅读器支持与无障碍最佳实践。
SVG 实战项目综合运用:仪表盘、环形进度、动画 Logo、数据可视化。