# Getting yellow color despite only entering one value on fill()

**URL:** <https://discourse.processing.org/t/getting-yellow-color-despite-only-entering-one-value-on-fill/33446>\
**Category:** Coding Questions\
**Created:** [November 10, 2021, 7:51pm UTC](https://discourse.processing.org/t/getting-yellow-color-despite-only-entering-one-value-on-fill/33446 "2021-11-10T19:51:12Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Kenga123456](https://avatars.discourse-cdn.com/v4/letter/k/f08c70/32.png) [@Kenga123456](https://discourse.processing.org/u/Kenga123456)\
**Post date:** [November 10, 2021, 7:51pm UTC](https://discourse.processing.org/t/getting-yellow-color-despite-only-entering-one-value-on-fill/33446/1 "2021-11-10T19:51:12Z")

</div>

```auto
int x = 10;
int y = 10;
int spacingX = 10;
int spacingY = 10;
void setup() {
	size(500, 500);
	
}
void draw () {
	background(255);
	
for (int x = 0; x < width; x = x + spacingX) {
		for (int y = 0; y < height; y = y + spacingY) {
			fill(0);
			rectMode(CENTER);
			int colorNot = dist(mouseX, mouseY, x, y);
			noStroke();
			float colorFinal = map(colorNot, 0, width, 255, 0);
			fill (colorFinal);
			rect(x, y, 20, 20); 
			
		}
}
}

```

On the parts far away I get yellow color?  
This part float colorFinal = map(colorNot, 0, width, 255, 0); should be returning a value between 255 - 0 so it should be a white to black color. Can someone explain?

---

<div class="post-metadata">

**Author:** ![Kenga123456](https://avatars.discourse-cdn.com/v4/letter/k/f08c70/32.png) [@Kenga123456](https://discourse.processing.org/u/Kenga123456)\
**Post date:** [November 10, 2021, 8:01pm UTC](https://discourse.processing.org/t/getting-yellow-color-despite-only-entering-one-value-on-fill/33446/2 "2021-11-10T20:01:06Z")

</div>

Nvm I solved it.  
Code:

```auto
int x = 10;
int y = 10;
int spacingX = 10;
int spacingY = 10;
void setup() {
	size(500, 500);
	
}
void draw () {
	background(255);
	
for (int x = 0; x < width; x = x + spacingX) {
		for (int y = 0; y < height; y = y + spacingY) {
			fill(0);
			rectMode(CENTER);
			int colorNot = dist(mouseX, mouseY, x, y);
			noStroke();
			float colorFinal = map(colorNot, 0, width, 255, 0);
		
			if (colorFinal < 0) { // makes it not go yellow. 
			colorFinal = 0;	
			}
			
			fill (colorFinal);
			rect(x, y, 20, 20); 
			
		}
}
}

```

When the distance between the mouse and rect goes beyond “width” the value that gets returned is less than zero.

float colorFinal = map(colorNot, 0, width, 255, 0);

A value that is 0 returns 255, a value that is width returns 0 and a value higher returns something less.  
And when you have fill on a color less than 0 you get a yellow color

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [November 10, 2021, 8:13pm UTC](https://discourse.processing.org/t/getting-yellow-color-despite-only-entering-one-value-on-fill/33446/3 "2021-11-10T20:13:06Z")

</div>

Hello,

Consider mapping to the diagonal length:

`int colorFinal = int(map(colorNot, 0, sqrt(width*width+height*height), 255, 0));`

`:)`

---

<div class="post-metadata">

**Author:** ![Kenga123456](https://avatars.discourse-cdn.com/v4/letter/k/f08c70/32.png) [@Kenga123456](https://discourse.processing.org/u/Kenga123456)\
**Post date:** [November 10, 2021, 8:43pm UTC](https://discourse.processing.org/t/getting-yellow-color-despite-only-entering-one-value-on-fill/33446/4 "2021-11-10T20:43:10Z")

</div>

I was considering that! Thank you 🙂