问题标签 [svg-filters]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
svg - SVG 过滤器元素的定义如何？
我们正在考虑使用 SVG 过滤器作为我们工具链的一部分，将 SVG 提供给能够支持它的浏览器，同时将预渲染的 PNG 提供给其他浏览器。
我们注意到的一个问题是过滤器链的渲染似乎在渲染器之间非常不一致。查看SVG 规范中的“filters01”示例时，我们尝试使用的工具之间的渲染看起来非常不同。Chrome (5.0.307.11) 无法渲染图像，而其他工具 (Firefox 3.6, Opera 10.10, Inkscape 0.47, GIMP 2.6.7) 渲染的东西在风格上与规范中的图片模糊相似，但没有两个是真正相同的.
这是规格不足的问题还是工具不存在？如果我们将 SVG 与滤镜效果一起使用：是否有参考工具可以按照规范的预期方式为我们提供渲染？
javascript - Firefox 中的 SVG 过滤器
出于某种原因，我无法让我的 SVG 过滤器在 Firefox 中工作。但是，它们在 Opera 中运行良好。我将其属性设置为过滤器的元素就消失了。这很奇怪。
这是我的 JavaScript 代码：
有什么想法吗？谢谢
graphics - 我可以在 SVG 中使用正常/钟形混合定义线性渐变吗？
考虑以下 svg 片段：
有没有办法指定颜色应该使用钟形曲线混合在一起？（类似于GDI+ LinearGradientBrush::SetBlendBellShape 方法）
下面的两个矩形显示了差异 -左边是没有钟形混合，右边是有钟形混合：
还是留给 SVG 渲染器来决定颜色应该如何混合在一起？
google-chrome - Webkit 和 SVG 过滤器支持
我正在尝试使用复杂的 SVG 过滤器在 Webkit 中生成结果。正如您将在下面看到的那样，该过滤器非常拥挤，但它呈现了一个漂亮的分形生成地图，并且在 Mozilla 中做得很好。我想让 Webkit 做同样的事情。
浏览器支持 SVG的Wikipedia 页面说 Webkit 在夜间构建中支持 SVG 过滤器，但没有说明它在发布版本上支持多少。我知道过滤器在每个实现中的行为都会有所不同。
我想知道的是；
- 为了让 Webkit 正确呈现它，我在这里遗漏了什么吗？
- 如果 #1 不是，那么是否有任何类似于 JavaScript 库或类似的东西可以使 Webkit 正确呈现过滤器？
更新
我发现Webkit 需要一个标志来启用 SVG 过滤器。有没有办法在 Safari 和 Chrome 中打开它？可以通过一些meta标签或javascript来完成吗？
过滤器
svg - 将 SVG 滤镜应用于背景图像
我正在尝试仅将 SVG 滤镜（高斯模糊）应用于图像的一部分（即背景）。我通过在相同位置附加一个裁剪的 SVG 图像并应用高斯模糊来实现效果（使其看起来像对原始图像应用了高斯模糊）。
这显然效率低下，我正在寻找更好的方法。在阅读了一些 SVG 文档和示例之后，看起来enable-background需要该属性，但我将非常感谢有关如何实际实现它的一些帮助！
编辑：
我正在寻找的效果示例：http: //img695.imageshack.us/img695/92/chromeblur.png
javascript - 将图像过滤器应用于画布图像数据或 JavaScript
我是一名 Flash 开发人员，我正在开发游戏的 JavaScript 端口。在 Flash 版本中，我使用发光、模糊和颜色矩阵过滤器来处理显示对象的外观。我想对我的 JavaScript 视图做同样的事情。其中一些是点缀，而另一些则用于精心制作所需的结果。因为这个项目的目标是创建一个精确的端口，我想知道我必须使用哪些选项来将过滤器应用于原始画布数据、内联 SVG 标记或直接处理 DOM 元素。
我考虑过 Pixastic，但我的合作者暂时坚持使用 GPL 许可证，这意味着我使用的任何技术都必须与 GPL 兼容。Pixastic 使用 Mozilla Public License，所以我不能使用它。（这是一个巨大的无赖，让我告诉你。）
我将再次简洁地说：如何有效地将像素过滤器应用于 DOM 元素、画布图像数据或使用 JavaScript 的 SVG 标签？
jquery - JQuery.SVG 的透明效果
我已经使用出色的 Jquery.SVG 绘制了一个 svg 路径（文档可能会更好）
一切正常。但我正在尝试做一些更有趣的事情。
有一个彩色矩形，我想使用 specularLighting 突出显示它。
我在想一些这样的代码：
$('#path-svg-id','#divid').filters.specularLighting(filter, 'specOut', 'blur', 5, 0.75, 20, {lightingColor: '#bbbbbb'});
但它不起作用。有任何想法吗？
design-patterns - SVG feBlend 在模式中？
我想通过加载图像然后在其上应用多重滤色器来创建图案。但是我认为我无法理解inandin2属性，因为它不起作用。
我正在尝试创建<img>and 设置fill="green"然后使用in="SourceGraphic" in2="FillPaint". 但我在 Firefox 和 Chromium 中都看到了全白画布。任何人都知道为什么这不起作用？混合工作in*="FillPaint"吗？我也尝试使用单独的矩形和图像并将两者混合，in2="BackgroundImage"但这也不起作用。也许是因为“背景”不是我在里面时所想的那样pattern？
这是我的代码：
html - 使用 css3 的 SVG 投影
是否可以使用 css3 为 svg 元素设置投影，例如
我看到了一些关于使用滤镜效果创建阴影的评论。有没有单独使用css的例子。下面是正确应用 cusor 样式但没有阴影效果的工作代码。请帮助我用最少的代码获得阴影效果。