SVG: adding a shadow filter makes a direct invisible line

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

Demo: https://jsfiddle.net/ccj0Ldfh/1/

+4
source share
1 answer

In the last paragraph here

The BoundingBox keyword object should not be used if the geometry of the applicable element does not have a width or height, for example, in the case of a horizontal or vertical line, even if the line has the actual thickness when viewed due to the absence of a non-zero one since the stroke width is ignored for bounding box calculations. If the geometry of the applicable element does not have a width or height, and the BoundingBox is specified, then this effect (for example, a gradient or filter) will be ignored.

+2
source

All Articles