W3C home > Mailing lists > Public > www-svg@w3.org > September 2001

Linear RBG and feComposite "arithmetic"

From: Jim Mork <jmork@jasc.com>
Date: Thu, 6 Sep 2001 17:16:30 -0500
Message-ID: <E580CB8FBC72D211A94A00A0C9B57292024A476B@EXCHANGE_SERVER>
To: "'www-svg@w3.org'" <www-svg@w3.org>

Several months ago, I ran into some problems achieving the proper results
with filter effects.  The problem stemmed from not using "linearRGB" as the
default for "color-interpolation-filters" (see spec 11.7.1).  That
correction seemed to take care of most of the problems, but there's another
problem now related to the use of feComposite with the "arithmetic" option
(actually, it appears this problem is affecting our implementation of
feComposite generally.)

An SVG sample is included at the end of this message.  The sample is the
result of reducing the composite example in the test suite down to elements
essential to demonstrating the problem.  The example consists of two
overlapping rectangles--one solid cyan (R=0,G=255,B=255,A=255) and one solid
magenta (R=255,G=0,B=255,A=255).   The feComposite "arithmetic" filter
effect is applied using "SourceGraphic" (magenta rectangle) and
"BackgroundImage" (part of cyan rectangle) as inputs.  Each image is
multiplied by the coefficent 0.5--add half of each together.

Normalizing colors to range of 0 to 1 (for clarity):

magenta * 1/255 = (255,0,255,255) * 1/255 = (1,0,1,1)
cyan * 1/255 = (0,255,255,255) * 1/255 = (0,1,1,1)

Multiply both by 0.5:

magenta * 0.5 = (1,0,1,1) * 0.5 = (0.5, 0, 0.5, 0.5)
cyan * 0.5 = (0,1,1,1) * 0.5 = (0, 0.5, 0.5, 0.5)

Add them together:
(0.5, 0, 0.5, 0.5) + (0, 0.5, 0.5, 0.5) = (0.5, 0.5, 1.0, 1.0)

If we scale this result back to 255ths, we get:
(0.5, 0.5, 1.0, 1.0) * 255 = (128, 128, 255, 255)

This is the result displayed by the Adobe plug-in.

However, if this result is converted back to sRGB (sRGB(x) ~ x^(1.0/2.2))*,
I get:
(0.73, 0.73, 1.0, 1.0)

(* I'm using the formula given in the spec.  This one's is roughhly
equivalent and shorter to write in this example.  For more info:
http://www.srgb.com/srgbgammacalculation.pdf)

If we scale that result back to 255ths, we get:
(186, 186, 255, 255)

I'm not sure which is the correct result.  Adobe's plug-in returns (128,
128, 255, 255) but if that result is converted back to sRGB from linearRGB,
the result is (186, 186, 255, 255).  Perhaps I've missed something in the
spec and/or I doing something wrong, but that is the result I get when my
effect processing is consisted in its use of linear RGB.

Any help or suggestions will be much appreciated!

Sincerely,

James Mork
Principal Software Engineer
Jasc Software Inc.

---snip--
<?xml version="1.0" standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG
1.0//EN" 	"http://www.w3.org/TR/2001/PR-SVG-20010719/DTD/svg10.dtd">
<svg width="100" height="100">
	<defs>
	<filter id="xfilter" filterUnits="objectBoundingBox" x="-5%" y="-5%"
		width="110%" height="110%">
		<feComposite in="SourceGraphic" in2="BackgroundImage"
result="comp"
			operator="arithmetic" k1="0" k2="0.5" k3="0.5"
k4="0"/>
	</filter>
	</defs>
	<rect x="20" y="10" width="40" height="82"
style="fill:rgb(0,255,255);stroke-width:1"/>
	<rect x="42" y="10" width="38" height="82"
style="fill:rgb(255,0,255);stroke-width:1;filter:url(#xfilter)"/>
</svg>
---snip---
Received on Thursday, 6 September 2001 18:24:03 GMT

This archive was generated by hypermail 2.3.1 : Friday, 8 March 2013 15:54:20 GMT