1

I'm having a nightmare with colour matrices. I'm using an adjustment layer in photoshop with the values Hue: -37, Saturation: -25 which results in a nice pinky dawn colour:

Photoshop Adjustment Layer

I'm trying to use EaselJS to create my matrix based on the values in my HSL adjustment layer for Rainmeter (which can only use these), so I'm generating my matrix like so:

new createjs.ColorMatrix().adjustColor(0, 0, -25, -37);

See here: http://www.createjs.com/docs/easeljs/classes/ColorMatrix.html#method_adjustColor

This results in a bright green colour as you can see:

Bright green

Is there another way to generate my colour matrix? Can I convert A Photoshop adjustment layer to a colour matrix? Could the difference in results be related to not having Colorize checked?

Chris Byatt
  • 3,689
  • 3
  • 34
  • 61
  • Please, use exactly same images for example. – weaknespase Mar 13 '16 at 18:08
  • @VallyN the images are the same. i'm just only applying the matrix to one layer in the second rather than the whole image – Chris Byatt Mar 13 '16 at 18:12
  • I know, that PS may use color correction. Maybe [ColorFilter](http://www.createjs.com/docs/easeljs/classes/ColorFilter.html) will be better is this case. – weaknespase Mar 13 '16 at 18:19
  • @VallyN the software i'm using the end result of the matrix generation in can only use a colour matrix. ColorFilter does not generate me a matrix. – Chris Byatt Mar 13 '16 at 18:21
  • No thoughts in particular, but one. Try transposed matrix. – weaknespase Mar 13 '16 at 18:33
  • Any chance you can share your original image for testing? – Lanny Mar 14 '16 at 16:51
  • @Lanny find the image here: http://www.firewatchgame.com/images/parallax/parallax1.png – Chris Byatt Mar 14 '16 at 20:53
  • I ran your basic ColorMatrix code in an isolated spike, and while it doesn't match the comp, it is in the right hue: http://screens.gskinner.com/lanny/Screen%20Shot%202016-03-14%20at%203.11.22%20PM.png http://jsfiddle.net/lannymcnie/k6zjnys4/ – Lanny Mar 14 '16 at 21:20
  • @Lanny bizarre.. thank for trying this out. I was using the output from ColorMatrix() in the application i was using as my colour matrix.. Interesting that it's still not the same colour... – Chris Byatt Mar 14 '16 at 21:25
  • @Lanny figured it out. the JS library fills the matrix array top to bottom not left to right. – Chris Byatt Mar 14 '16 at 21:42

1 Answers1

1

The answer to this turned out to be fairly simple. The matrixes generated were correct with slight differences. These differences turned out to be because a Photoshop HSL adjustment layer also changes the brightness and contrast. I believe that Lightness is a function of Brightness and Contrast although I'm not sure how it is worked out so it's not easy to get it perfect. Trial and error basically.

The reason my colours were totally wrong before was down to the fact that the array generated by ColorMatrix.js fill the matrix top to bottom not left to right.

i.e.:

Array [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

Becomes:

Matrix [[0, 2, 4, 6, 8],
        [1, 3, 5, 7, 9]]

Shortened for example, true colour matrix will be a 5x5 matrix.

Chris Byatt
  • 3,689
  • 3
  • 34
  • 61