Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.
Dismiss

Near random colors to picture pixels, so that same color matches same random color.

136 views
Skip to first unread message

K R

unread,
Nov 15, 2020, 2:01:01 PM11/15/20
to
Anyone can point to a place, where to download code for this ?


KR

Ph.: 372 57865442
E-m.: mi23523523 fastmail c o m

Michael Haufe (TNO)

unread,
Nov 15, 2020, 2:07:18 PM11/15/20
to
On Sunday, November 15, 2020 at 1:01:01 PM UTC-6, rob9999999...@gmail.com wrote:
> Anyone can point to a place, where to download code for this ?
>

I don't know what you mean. Can you give more details?

Kristjan Robam

unread,
Dec 22, 2020, 12:29:30 PM12/22/20
to
What I want to say is the following.
Function:
Renewing each picture color.
New picture colors must satisfy this:
1. Each pixel color goes to random.
2. Each same color pixel goes to same color, that is defined in point 1.

Basically what you would need is a reminder of assigned colors of picture pixels.



Actually I got that one programmed as far as I remember.

But what I would now need very much is a function, that turns colors to random so,
that the difference of near colors is the distance of the original colors of points A and B.

If you can help me with that, I would be very thankful.


Kristjan Robam

Michael Haufe (TNO)

unread,
Dec 22, 2020, 2:35:39 PM12/22/20
to
On Tuesday, December 22, 2020 at 11:29:30 AM UTC-6, Kristjan Robam wrote:

> [...]
>
> But what I would now need very much is a function, that turns colors to random so,
> that the difference of near colors is the distance of the original colors of points A and B.

Assuming 24 bits for color plus 8 bits for the alpha channel, a random color would be an integer between 0 and 0xFFFFFFF inclusive:

```
const randomInt = (max) => Math.floor(Math.random() * Math.floor(max))

const randomColor = randomInt(0xFFFFFFFF)
```

The second part of your sentence reads to me like you want a linear interpolation of two colors, or maybe you just want the average?

```
let avgColor = (c1,c2) => Math.floor((c1 + c2) / 2)
```

```
const lerp = (t, a, b) => (1 - t) * a + t * b

const RED = 0xFF0000FF
const BLUE = 0x0000FFFF

lerp(0,RED,BLUE).toString(16) // ff0000ff
lerp(0.5,RED,BLUE).toString(16) // 7f80807f
lerp(1,RED,BLUE).toString(16) // 0000ffff
```

Richard Damon

unread,
Dec 22, 2020, 2:59:08 PM12/22/20
to
If your requirements are that the 'spacing' between all colors in the
original image and in the new image are preserved, your randomness is
going to be greatly limited. One big question is how you want to define
the distance between colors (largly which color space you want to
measure in). If you presume that the image might be using a broad
assortment of colors and distance measured but RGB distance, then the
only general transformations that preserve distances would be swapping
axis and reversing the direction of some of the axis.

Some other spaces might give slightly different options, but similar, as
'Hue' based color spaces have a polar axis which behaves a bit
differently than a cartisian axis so can't really swap with another
axis, but can have an arbitrary offset or can be flipped (so gives more
options).
Message has been deleted
Message has been deleted
Message has been deleted
Message has been deleted

Kristjan Robam

unread,
Dec 23, 2020, 2:30:29 PM12/23/20
to
Hello guys.

Richard Damon, as you said I need 'spacing' preserved. And one more requirement. All the color areas must match with new random colors.
It could take any color that is the same far in my color distance sense. One base color R(red){others G and B. The alpha is not so important I think at the moment.} distance sqr((R1*R1+R2*R2)/2).
It would take the "first" found R,G,B triple, whose difference is equal to original neighbour color distance.

Parimate tervitustega Eestist ( With the best hello's from Estonia),
Kristjan Robam

Richard Damon

unread,
Dec 23, 2020, 3:23:52 PM12/23/20
to
On 12/23/20 2:15 PM, Kristjan Robam wrote:
> Richard Damon kirjutas teisipäev, 22. detsember 2020 kl 21:59:08 UTC+2:
> Hello guys.
>
> Richard Damon, as you said I need 'spacing' preserved. And one more requrement. When all the color areas must mach with new random colors.
> It could take any color that is the same far in my color distance sense.
> One base color R(red){others G and B. The alpha is not so important I think at the moment.} distance sqr((R1*R1+R2*R2)/2).
> It would take the "first" found R,G,B triple, whose difference is equal to original neighbour color distance.
>
> Parimate tervitustega Eestist ( it is good hello's from Estonia),
> Kristjan Robam
>

As I said, to map points in the RGB cube to other points in the RGB
cube, such that the spacing of all points stay the same, you are very
limited in what you can do (unless your set of colors used are very
carefully chosen).

You can first swap color axis in any of 6 way:

RGB -> RGB RBG GRB GBR BRG BGR

and then each of the 3 axis can individually be swapped end for end.

This gives 48 possible transformations and that is it.

The issue is that if you map one color at 'random', then choose a second
color from the right distance shell, and a 3rd color will be constrained
from a circle, and a forth will have just two possible values that have
the right distange. After that every point will have just a single
option that is the right distance from every other point. Then, unless
you chose the points to match one of the rules above, some of the colors
will be forced to be mapped outside the base RGB space, thus you will
need to reject that mapping. Unless the space of the input colors leaves
wiggle room inside the color cube you are stuck with just those
transformations.

Kristjan Robam

unread,
Dec 24, 2020, 4:10:54 AM12/24/20
to
One thing more. That may not be clear.
The new (random) colors must be map to the original colors.

With best Christmas wishes,
Kristjan Robam

Kristjan Robam

unread,
Dec 24, 2020, 4:12:07 AM12/24/20
to
It would be cool, if someone could just post a Javascript code for this.


Kristjan Robam

Kristjan Robam

unread,
Dec 24, 2020, 7:49:43 AM12/24/20
to
You could take the start code from:
https://groups.google.com/g/comp.programming/c/ch6aYxj0_RI


I just started myself programming it too.



Kristjan

Kristjan Robam

unread,
Dec 24, 2020, 8:46:13 AM12/24/20
to
What I mean is something like the following. But I haven't tested it yet.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<canvas id="canvas" width="555" height="555"></canvas>
<p></p>

<div style="display:none;">
<img src="data:image/jpeg;base64,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" id="yyye" width="271" height="329"/>
</div>

<script>

function aaaaa() {

var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');

var img = document.getElementById('yyye');

ctx.drawImage(img, 0, 0);

var imgData = ctx.getImageData(0, 0, canvas.width, canvas.height);


var datanew=array();
for(var i0=0; i0<imgData.data.length/4; i0++) {
datanew[]=array();
}

var data0=array();
for(var i0=0; i0<imgData.data.length; i0=i0+4) {
data0[]=array(imgData[i0],imgData[i0+1],imgData[i0+2],imgData[i0+3]);
}

var a1=Math.round(Math.random()*255);
var a2=Math.round(Math.random()*255);
var a3=Math.round(Math.random()*255);
var a4=Math.round(Math.random()*255);

datanew[0][]=a1;
datanew[0][]=a2;
datanew[0][]=a3;
datanew[0][]=a4;

var i001=0;
while(true) {
i001++;
var exit=true;
for(var i0=0; i0<datanew.length; i0++) {
if(datanew[i0].length==0){
exit=false;
}
}

if(exit==true) break;

if(datanew[i001].length>0) continue;

var d=Math.sqrt((data0[i001][0]*data0[i001-1][0]+data0[i001][1]*data0[i001-1][1]+
data0[i001][2]*data0[i001-1][2]+data0[i001][3]*data0[i001-1][3])/4);
var distancefound=false;
while(distancefound==false) {

a1=Math.round(Math.random()*255);
a2=Math.round(Math.random()*255);
a3=Math.round(Math.random()*255);
a4=Math.round(Math.random()*255);
datanew[i001][0]=a1;
datanew[i001][1]=a2;
datanew[i001][2]=a3;
datanew[i001][3]=a4;

var d1=Math.sqrt((datanew[i001][0]*datanew[i001-1][0]+datanew[i001][1]*datanew[i001-1][1]+
datanew[i001][2]*datanew[i001-1][2]+datanew[i001][3]*datanew[i001-1][3])/4);

if(d1-d2<10) distancefound=true;
if(distancefound==true) {

for(var i0=0; i0<data0.length; i0++) {
if(data0[i0][0]=data0[i001-1][0]&&data0[i0][1]=data0[i001-1][1]&&
data0[i0][2]=data0[i001-1][2]&&data0[i0][3]=data0[i001-1][3]){
newdata[i0][0]=a1;
newdata0[i0][1]=a2;
newdata0[i0][2]=a3;
newdata0[i0][3]=a4;
}
}


}

}
i001++;
}




for (i = 0; i < imgData.data.length; i += 4) {
imgData.data[i] = datanew[i][0];
imgData.data[i + 1] = datanew[i][1];
imgData.data[i + 2] = datanew[i][2];
imgData.data[i + 3] = datanew[i][3];
}

ctx.putImageData(imgData, 0, 0);

}

aaaaa();

</script>
</body>
</html>

Kristjan Robam

Kristjan Robam

unread,
Dec 24, 2020, 1:53:56 PM12/24/20
to
I have been playng around with this code now:

<html>
<body>
<canvas id="canvas" width="555" height="555"></canvas>
<p></p>

<div style="display:none;">
<img src="data:image/jpeg;base64,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" id="yyye" width="271" height="329"/>
</div>

<script>

function aaaaa() {

var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');

var img = document.getElementById('yyye');

ctx.drawImage(img, 0, 0);

var imgData = ctx.getImageData(0, 0, canvas.width, canvas.height);


var datanew=new Array();
for(var i0=0; i0<imgData.data.length/4; i0++) {
datanew.push(new Array());
}

var data0=new Array();
for(var i0=0; i0<imgData.data.length; i0=i0+4) {
data0.push(new Array(imgData.data[i0],imgData.data[i0+1],0,0));
}

var a1=Math.round(Math.random()*255);
var a2=Math.round(Math.random()*255);
var a3=0;
var a4=0;

datanew[0].push(a1);
datanew[0].push(a2);
datanew[0].push(a3);
datanew[0].push(a4);

var i001=0;
var iiiii0=0;

while(true) {

iiiii0++;

if(iiiii0>555) break;


i001++;
/*
var exit=true;
for(var i0=0; i0<datanew.length; i0++) {
if(datanew[i0].length==0){
exit=false;
console.log("fff");
}
}

if(exit==true) break;
*/

console.log(data0[i001]);
console.log(data0[i001-1]);

var d=Math.sqrt(((data0[i001][0]-data0[i001-1][0])*(data0[i001][0]-data0[i001-1][0])+(data0[i001][1]-data0[i001-1][1])*(data0[i001][1]-data0[i001-1][1])+
(data0[i001][2]-data0[i001-1][2])*(data0[i001][2]-data0[i001-1][2])+(data0[i001][3]-data0[i001-1][3])*(data0[i001][3]-data0[i001-1][3]))/4);
var distancefound=false;
while(distancefound==false) {

for(var j1=0;j1<255;j1++) {
if(distancefound) continue;
for(var j2=0;j2<255;j2++) {
if(distancefound) continue;
for(var j3=0;j3<2;j3++) {
if(distancefound) continue;
a1=j1;
a2=j2;
a3=0;
a4=0;
datanew[i001][0]=a1;
datanew[i001][1]=a2;
datanew[i001][2]=a3;
datanew[i001][3]=a4;

var d1=Math.sqrt(((datanew[i001][0]-datanew[i001-1][0])*(datanew[i001][0]-datanew[i001-1][0])+(datanew[i001][1]-datanew[i001-1][1])*(datanew[i001][1]-datanew[i001-1][1])+
(datanew[i001][2]-datanew[i001-1][2])*(datanew[i001][2]-datanew[i001-1][2])+(datanew[i001][3]-datanew[i001-1][3])*(datanew[i001][3]-datanew[i001-1][3]))/4);

if((Math.abs(d1-d)>0)&&(Math.abs(d1-d)<10)) distancefound=true;
console.log(d+" "+d1);
if(distancefound==true) {
console.log("distancef");
/*
for(var i0=0; i0<data0.length; i0++) {
if(data0[i0][0]==data0[i001-1][0]&&data0[i0][1]==data0[i001-1][1]&&
data0[i0][2]==data0[i001-1][2]&&data0[i0][3]==data0[i001-1][3]){
datanew[i0][0]=a1;
datanew[i0][1]=a2;
datanew[i0][2]=a3;
datanew[i0][3]=a4;
}
}
*/


}
}
}


}
}
i001++;
}


console.log("end");
/*
for (i = 0; i < imgData.data.length; i += 4) {
imgData.data[i] = datanew[i][0];
imgData.data[i + 1] = datanew[i][1];
imgData.data[i + 2] = datanew[i][2];
imgData.data[i + 3] = datanew[i][3];
}

ctx.putImageData(imgData, 0, 0);
*/
}

aaaaa();

</script>
</body>
</html>



Please help me, if you can.


Kristjan Robam

Michael Haufe (TNO)

unread,
Dec 25, 2020, 12:34:02 PM12/25/20
to
On Thursday, December 24, 2020 at 12:53:56 PM UTC-6, jippii...@gmail.com wrote:
> I have been playng around with this code now:
>
> [...]
>
> Please help me, if you can.

Do you want to just apply a filter to an image?

<https://www.html5rocks.com/en/tutorials/canvas/imagefilters/>

Kristjan Robam

unread,
Dec 26, 2020, 2:17:11 AM12/26/20
to
That is a good idea, but I would like this code to work, but it seems to be too slow. Probably because of
it is programmed not very optimally.
With smaller images it would run faster I believe.



Kristjan
Message has been deleted

Kristjan Robam

unread,
Dec 26, 2020, 2:33:35 AM12/26/20
to
Michael, I believe You understand, what I am trying to do ?

I deleted some of the code from beginning, where it checks if a color is already assigned to a pixel, to make it first more simple. Because it loaded too slowly.


Kristjan Robam

Michael Haufe (TNO)

unread,
Dec 26, 2020, 11:30:27 AM12/26/20
to
I'd suggest getting it to work even if it's slow. After that we could potentially look into optimization..

Kristjan Robam

unread,
Dec 27, 2020, 10:57:35 AM12/27/20
to
Yes. But I am so lazy, that I don't want to waste my time and am posting this for doing for You, guys....... ;)





Kristjan

H E

unread,
Jan 15, 2021, 12:31:34 PM1/15/21
to

I A

unread,
Feb 14, 2021, 12:24:34 PM2/14/21
to
What I actually wanted to say was:
I need a code, that creates a random color x for pixel y and makes a new picture, that has all new pixels with same r,g,b distance as color x and pixel y color distance. Basically New point (X1R,X1G,X1B) is ((randomcR-x0R+x1R)%255; (randomcG-x0G+x1G)%255; (randomcB-x0B+x1B)%255).



He (Tema)

E-mail: he4124135 mail co m
Telephone number: 372 6861327

Michael Haufe (TNO)

unread,
Feb 15, 2021, 8:55:17 AM2/15/21
to
On Sunday, February 14, 2021 at 11:24:34 AM UTC-6, I A wrote:
> What I actually wanted to say was:
> I need a code, that creates a random color x for pixel y and makes a new picture, that has all new pixels with same r,g,b distance as color x and pixel y color distance. Basically New point (X1R,X1G,X1B) is ((randomcR-x0R+x1R)%255; (randomcG-x0G+x1G)%255; (randomcB-x0B+x1B)%255).

This was demonstrated in the link I gave earlier:

<https://www.html5rocks.com/en/tutorials/canvas/imagefilters/>
Message has been deleted
Message has been deleted

Minai Robam

unread,
Mar 30, 2021, 12:39:34 PM3/30/21
to
The address seems interesting.





Mina

Menime

unread,
Oct 5, 2022, 6:02:10 AM10/5/22
to
What I actually woule have wanted: Near random colors to one chosen pixel, so that the distances of colours would be the same.


Have a nice day, everybody.
0 new messages