We are about to switch to a new forum software. Until then we have removed the registration on this forum.
I am new to Processing, and I have done quite a lot of searching, but I dont seem to be getting anywhere. My objective is to take all the colours from an image, and arrange them by hue in a colour wheel. I presume the result will represent a pie chart more than an actual spectrum, but that's ok.
I am a designer not a programmer, so integers and arrays are a little alien to me. I have however got code from the GENERATIVE DESIGN book which I thought might work: http://www.generative-gestaltung.de/P_1_1_2_01 for a colour spectrum, http://www.generative-gestaltung.de/P_1_2_2_01 which loads the colour pixels from the image, however does not really arrange them, and uses the mouse x, y coords to tile the colours. It does seem to group similar hues together, which is perfect.
I think what I need is some kind of a cross between these two projects. So firstly, is something like this possible? And if so, am I looking in the right place? Thanks in advance. R
This is the code I am using (not my own), however getting the colors from the image is where I am struggling. For example, using an Australian flag, would hopefully reveal radians within a circle that were roughly 70% blue, 20% red, 10% white. Arranging the pixels by hue within a 360 degree spectrum. Any ideas as to how I could achieve this?
can you attach the image here?
Yes sure, thanks for taking a look koogs. GoToLoop thanks for your help, I will have to try that when I get home from work, no processing at work!
and a mock up of what you want the output to be like would be good. just a pie chart with red, blue and white in it? (you might get intermediate colours, especially if that's a jpg, but their counts will be small)
gotoloop's (UNDOCUMENTED) code does the hue summing for you, you just need to do the display of the results given an intDict as an input (yuck!)
Thanks koogs, exactly, just a pie chart, well doughnut to be exact, however I can place an ellipse over the final image to 'mask' out the centre. I know that some intermediate colours will be present, that can't be helped unless I use vectors I suppose, however, the PNG should be ok for now. I hope to use an array of country flags eventually, and when I get this whole thing to work as I want I will upload final results. Thanks again for all your help!
so is that done or just mocked up?
pie charts are easy enough. get the total of all the sums (equal to total pixels in the image) and use arc
where each arc is the count for the current colour / the total mapped (using map()) from 0 to TWO_PI.
(then a white ellipse in the middle as you say)
No, just a mock up. But thanks, I will give that a go!
Ok, excuse the ignorance and yes I am a total newb here. GoToLoop's kind contribution outputs the below:
I know I am missing something huge here, I can't seem to load the img, and then shouldn't the output be circular?
his example was more about summing the hues. the input, top left, is random pixels, the output is the same pixels sorted but, yes, square.
Ok thanks, I get it. Now I will try decipher :)
Thanks for everyone's help. I have a long way to go :)
not really, you have all the bits.
use an IntDict for the incrementing, use the hue as the key
the pie chart is just mapping the ratio of each colour to the range 0 to TWO_PI (or 0 to 360). use arc().
don't worry if you don't understand gotoloop's code - nobody else does either.
I had some help with this code, however I have two problems to solve: 1. I can't seem to get the values of saturation & brightness. Currently, they get set to 100. I can see why, but I try to create a variable for each of them and fail hopelessly. 2. I will eventually need to load an array of images in, but this is a much more complex issue.