Inkscape layer blend mode tests

[brynn]

Just came across an SVG image which wasn't showing in Firefox.  Found one layer set to Darken blend modes and the other layer set to Lighten.  That fixed the problem, which I find surprising.  Thus my curiosity leads me to experiment   

Ok starting with this original SVG.  The star is in Layer 2.  Celtic knot is in Layer 1: 

ck45-test-layer-blend.svg
(7.27 kB - downloaded 612 times)

Now with Layer 1 switched to Lighten: 

ck45-test-layer-blend.svg
(7.56 kB - downloaded 612 times)
In case this is only happening in Firefox, only the star (layer 2) is visible for me.

And now that layer switched back to normal, and Layer 2 with Darken: 

ck45-test-layer-blend.svg
(7.56 kB - downloaded 592 times)
In case this is only happening in Firefox, only the celtic knkot (layer 1) is visible for me.

And finally, both (Layer 1 Lighten, Layer 2 Darken): 

ck45-test-layer-blend.svg
(7.84 kB - downloaded 632 times)
In case this is only happening in Firefox, this image isn't showing at all.

[brynn]

Wow!  It looks like using any kind of Blend Mode somehow blocks that layer from showing up!  I don't know how or why it does that, but hopefully someone can explain 

Next test with other blend modes, out of curiosity.

[brynn]

Layer 1 in Multiply, Layer 2 is Normal:

ck45-test-layer-blend.svg
(7.56 kB - downloaded 615 times)
Only star showing in Firefox

Layer 1 is Normal, Layer 2 is Screen:

ck45-test-layer-blend.svg
(7.56 kB - downloaded 632 times)

[brynn]

Ok, now going to find IE....

Edit
Looks like the layer blend modes are too much for IE.  It displays SVG images on other pages, where no blend modes are used.  But on this page, it doesn't want to work.  It displays the top page, but it freezes when I try to scroll down.

So anyway, it will be interesting to learn how other browsers handle it!

[Lazur]

Layers are groups, blending modes are filters.
If there is some transformation involved -like you resized the page once- the filters got transformed with it
which browsers do not support.
It may be easier to add the same blend filters to objects without layering for a test.

[brynn]

Ok, thanks Lazur 

What is it that some browsers don't support -- the filters?  or the filtered content that's being resized?

In my tests above, I wasn't actually trying to achieve a certain effect.  Some objects need to be overlapping to be able to see the effect of the blend modes. (keyword "blend" - needs 2 or more things to blend)  But in the topic which got me curious, there were a lot of overlapping objects.  However, removing the blend modes didn't change the appearance of the drawing, as far as I could tell, at all.

Here's the link to that topic:  http://forum.inkscapecommunity.com/index.php?topic=374.0

[Lazur]

For example the blurred drop shadow on the right in this image.
It was a known bug resulting pixelation in 0.48 if the blurred object was rotated.

Resizing page to content doesn't have such a visual effect but still it is not supported by browsers to transform filters.

[brynn]

Mmmmm....  Since filters are raster content, it seems odd that browsers can't support.  I try to remember   

[Lazur]

Filters are generated live just as any other vector element, affected by zooming in browsers.
The filtered area or part of it is rendered onto the screen's pixel grid.
If you involve a transformation on top of the filter chain the two grid mismatch.
Seems an easier way out to not rener that instead of something that is not looking correct. 

[brynn]

Ok, thanks again