Question

I have the following problem:

I have pictures in <img>-elements on a site. They are all in srgb colorspace, this information is included in all of them.
They look just like they should in Safari, Chrome and Firefox.
I then load images into a canvas-object using drawImage(imageObject). These images look exactly like the ones in the <img>-elements in chrome and firefox (which is the behavior intended by w3c as far as I know).
However, these images in the canvas-element look different in safari! From what I found ou it looks like the colorspace is being dropped / ignored so the colors are shifting really bad.

I'm using Safari 6.0.2 on OSX 10.8.2

Are there any workarounds known for this bad behavior?

Thank you!

Was it helpful?

Solution

The spec says:

The canvas APIs must perform color correction at only two points: when rendering images with their own gamma correction and color space information onto the canvas, to convert the image to the color space used by the canvas (e.g. using the 2D Context's drawImage() method with an HTMLImageElement object), and when rendering the actual canvas bitmap to the output device.

http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#color-spaces-and-color-correction

It's a Safari bug then.

I don't believe there is workaround unless you manually adjust the pixel colors in to match the color space in Safari by implementing your own filter.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top