SVG：添加阴影过滤器使直线不可见 [英] SVG: adding shadow filter makes straight line invisible

问题描述

我想为我的SVG添加阴影。它适用于所有2D对象，但是当将相同的过滤器应用于直线（< line> 或< path&

I'm trying to add a shadow to my SVG. It works well with all 2D objects, but when same filter is applied to a straight line (either <line> or <path>), the line becomes invisible, and no shadow is added.

演示： https://jsfiddle.net/ccj0Ldfh/1/

推荐答案

根据最后一段此处

当适用元素的几何图形没有宽度或没有高度时，例如水平或垂直线的情况下，即使当线具有实际厚度时，不应使用关键字objectBoundingBox当由于具有非零行程宽度而被观察时，因为对于边界框计算忽略了行程宽度。当适用元素的几何没有宽度或高度，并且指定了objectBoundingBox时，将忽略给定的效果（例如渐变或过滤器）。

Keyword objectBoundingBox should not be used when the geometry of the applicable element has no width or no height, such as the case of a horizontal or vertical line, even when the line has actual thickness when viewed due to having a non-zero stroke width since stroke width is ignored for bounding box calculations. When the geometry of the applicable element has no width or height and objectBoundingBox is specified, then the given effect (e.g., a gradient or a filter) will be ignored.

这篇关于SVG：添加阴影过滤器使直线不可见的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！