I'm kinda new to this and I'm sure some of you will find a stranger/smaller solution... Golf away!
-
-
Save xpansive/1241234 to your computer and use it in GitHub Desktop.
HSV to RGB in 107 bytes
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| function( | |
| //parameters range from 0 - 1 | |
| a, // hue 0.0 - 1.0 | |
| b, // saturation 0.0 - 1.0 | |
| c, // value 0.0 - 1.0 | |
| d, // hue divider | |
| e, // value splitter | |
| f // array placeholder | |
| ){ | |
| d=a*6%1; // deviation of the current hue (red<->yellow<->green<->cyan<->blue<->violet), | |
| // the higher the value, the more the color deviates to the next hue | |
| // create an array of the color strength regardless of hue | |
| f=[ | |
| c, // full value on this color | |
| -c*d*b+c, // deviation part 1 | |
| e=-c*b+c, // deviation part 2 | |
| e, // median deviation | |
| c*d*b+e, // deviation part 3 | |
| c // full value | |
| ]; | |
| // select the colors out of the array in regard of hue | |
| return[ // [r,g,b] - ranges from 0 to 1 | |
| f[d=a*6|0], //red | |
| f[(4+d)%6], //green | |
| f[(2+d)%6] //blue | |
| ] | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| function(a,b,c,d,e,f){d=a*6%1;f=[c,-c*d*b+c,e=-c*b+c,e,c*d*b+e,c];return[f[d=a*6|0],f[(4+d)%6],f[(2+d)%6]]} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE | |
| Version 2, December 2004 | |
| Copyright (C) 2011 YOUR_NAME_HERE <YOUR_URL_HERE> | |
| Everyone is permitted to copy and distribute verbatim or modified | |
| copies of this license document, and changing it is allowed as long | |
| as the name is changed. | |
| DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE | |
| TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION | |
| 0. You just DO WHAT THE FUCK YOU WANT TO. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "name": "hsvToRgb", | |
| "description": "Converts colors from HSV to RGB.", | |
| "keywords": [ | |
| "color", | |
| "rgb", | |
| "hsv" | |
| ] | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <title>hsvToRgb Test</title> | |
| <canvas id="canvas"></canvas> | |
| <script> | |
| var hsvToRgb = function(a,b,c,d,e,f){d=a*6%1;f=[c,-c*d*b+c,e=-c*b+c,e,c*d*b+e,c];return[f[d=a*6|0],f[(4+d)%6],f[(2+d)%6]]} | |
| var canvas = document.getElementById("canvas"); | |
| var ctx = canvas.getContext("2d"); | |
| var size = canvas.width = canvas.height = 150; | |
| var imageData = ctx.createImageData(size, size); | |
| var pixels = imageData.data; | |
| var hue = 0; | |
| setInterval(function() { | |
| var hue = new Date/4000; | |
| for (var i = size * size * 4; i -= 4;) { | |
| var c = hsvToRgb(hue % 1, i / 4 % size / size, i / 4 / size / size); | |
| pixels[i] = c[0] * 255; | |
| pixels[i + 1] = c[1] * 255; | |
| pixels[i + 2] = c[2] * 255; | |
| pixels[i + 3] = 255; | |
| } | |
| ctx.putImageData(imageData, 0, 0); | |
| }, 50) | |
| </script> |
That's ok, we can create the commented version together.
function(
//parameters range from 0 - 1
a, // hue 0.0 - 1.0
b, // saturation 0.0 - 1.0
c, // value 0.0 - 1.0
d, // hue divider
e, // value splitter
f // array placeholder
){
d=a*6%1; // deviation of the current hue (red<->yellow<->green<->cyan<->blue<->violet),
// the higher the value, the more the color deviates to the next hue
// create an array of the color strength regardless of hue
f=[
c, // full value on this color
-c*d*b+c, // deviation part 1
e=-c*b+c, // deviation part 2
e, // median deviation
c*d*b+e, // deviation part 3
c // full value
];
// select the colors out of the array in regard of hue
return[ // [r,g,b] - ranges from 0 to 1
f[d=a*6|0], //red
f[(4+d)%6], //green
f[(2+d)%6] //blue
]
}
Wow... Thanks! I didn't really understand any of the math when I wrote it and just sort of hoped it would work when I changed something. That's probably the best commented version of the algorithm on the web!
Also, here's my latest project, hsl to/from hsv: https://gist.github.com/1337890
Same problem here. The function returns bad colors when hue is exactly 1. Here is a fixed 100 bytes version based on what we did at https://gist.github.com/1325937.
function(a,b,c){a*=6;b*=c;b=[c,c-a%1*b,c-b,c-b,c-b+a%1*b,c];return[b[~~a%6],b[(a|16)%6],b[(a|8)%6]]}A few comments and hints:
- I try to avoid dummy arguments and reuse variables instead. For example, in your original code,
fcan be replaced withborcbecause both are not used after the final assignment. - Switching the summands in
-c*b+ctoc-c*bsaves 1 byte. - The
|16and|8snippets are very strange and explained here: https://gist.github.com/1325937#gistcomment-62276
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
@atk I somehow missed that comment two months ago... Thanks for the optimization, and also I can't really comment it more because I don't understand how it works. I just found the algorithm elsewhere and minified it.
@davidkaneda
Not sure. I'll look into it.