简介 <feConvolveMatrix> 为卷积矩阵滤镜，该滤镜可以让一个像素的色值与其周围的像素点进行组合，通过卷积实现一些成像操作。比如模糊、边缘检测、锐化、压花和斜角等。 卷积矩阵基于一个 n * m…
：2021-08-24：专栏 svg ：svg 卷积矩阵 feConvolveMatrix 压花 浮雕
简介 光照这一节的计算实在太抽象了，W3C 上文档真的是能写多少写多少，几个公式就结束了。我没有去推算过，主要是无能为力，没学过计算机图形学。本节仅从效果上探讨 svg 的光照效果。 SVG…
：2021-08-24：专栏 svg ：svg 光照滤镜 feDiffuseLighting feDistantLight fePointLight feSpecularLighting feSpotLight 光照效果 远光 聚光
简介 <feComposite> 滤镜用来处理两个图像的智能像素组合，它和 <feBlend> 滤镜类似，也有两个输入源 in 和 in2。 它还有一个重要的属性 operator 来决定如何处理两个图像的组合。 这个滤镜的兼容性非常差，即使我在 Chrome 92.x…
：2021-08-19：专栏 svg ：svg feComposite operator
介绍 <feMerge> 滤镜允许你不按顺序应用多个滤镜效果，<feMerge> 滤镜本身没有任何特殊属性，它通过包裹多个 <feMergeNode> 元素来应用多个滤镜。 <feMergeNode> 节点使用 in…
：2021-08-19：专栏 svg ：svg feMerge feMergeNode
简介 <feDropShadow> 阴影滤镜非常简单，它只有三个属性： dx：投影的 x 偏移。 dy：投影的 y 偏移。 stdDeviation：该属性定义了阴影中模糊操作的标准偏差。数值越大，图案立体效果越明显，值为…
：2021-08-18：专栏 svg ：svg 阴影滤镜 feDropShadow 泛色 flood-color flood-opacity
使用 <feFlood> 滤镜可以在矩形滤镜区域内进行泛色填充，<feFlood> 的填充的区域始终是一个矩形。它的效果类似遮罩 <mask>。 它有两个属性分别是： flood-color 这个属性用来设置填充颜色； flood-opacity…
：2021-08-18：专栏 svg ：svg 滤镜 泛色 feFlood flood-color flood-opacity
使用 <feOffset> 滤镜可以设置图案的偏移量，类似 css 中的相对定位效果。 可以使用 dx、dy…
：2021-08-18：专栏 svg ：svg 滤镜 偏移 feOffset
混合 <feBlend> 混合滤镜用来把两个滤镜或者输入源进行混合，混合的方式也有多种。 <feBlend> 滤镜有以下属性： 属性 值类型 描述 in 参考这里 输入源 1 in2 同 in 属性 输入源 2 mode normal | multiply | screen…
：2021-08-18：专栏 svg ：svg 滤镜 混合 混合模式 feBlend
<feGaussianBlur> 是高斯模糊滤镜。 该滤镜对输入图像进行高斯模糊，属性 stdDeviation 中指定的数量定义了钟形。 示例： 效果如下： 高斯模糊效果就像近视一样。
：2021-08-18：专栏 svg ：svg 滤镜 高斯模糊 stdDeviation feGaussianBlue
介绍 <feComponentTransfer> 滤镜为组件置换滤镜，它允许你配合 <feFuncR>、<feFuncG>、<feFuncB>、<feFuncA> 这些色彩通道组件对 RGBA…
：2021-08-18：专栏 svg ：svg feComponentTransfer feFunc table 表格分布 discrete 离散分布 linear 线性分布 gamma 伽马分布