# Drawing scaling based on position in window size?

**URL:** <https://discourse.processing.org/t/drawing-scaling-based-on-position-in-window-size/17303>\
**Category:** Coding Questions\
**Created:** [January 24, 2020, 5:51am UTC](https://discourse.processing.org/t/drawing-scaling-based-on-position-in-window-size/17303 "2020-01-24T05:51:17Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![AxFan](https://avatars.discourse-cdn.com/v4/letter/a/a88e57/32.png) [@AxFan](https://discourse.processing.org/u/AxFan)\
**Post date:** [January 24, 2020, 5:51am UTC](https://discourse.processing.org/t/drawing-scaling-based-on-position-in-window-size/17303/1 "2020-01-24T05:51:17Z")

</div>

Hey guys so I want to know how a ball or drawing can be scaled as it moves from one area to the other? Say I have a ball and its being controlled by my mouse, at the bottom left corner its big, but as I move it towards the top right it gets small. How may I achieve this?

---

<div class="post-metadata">

**Author:** ![kfrajer](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kfrajer/32/196_2.png) [@kfrajer](https://discourse.processing.org/u/kfrajer)\
**Post date:** [January 27, 2020, 6:43am UTC](https://discourse.processing.org/t/drawing-scaling-based-on-position-in-window-size/17303/2 "2020-01-27T06:43:43Z")

</div>

From the example [here](https://processing.org/examples/bounce.html) I did the following modification to change the size based on position along the Y axis.

Kf

```java
final float MINSIZE=5;
final float MAXSIZE=60;
float rad = 60; // Width of the shape
float xpos, ypos; // Starting position of shape    

float xspeed = 2.8; // Speed of the shape
float yspeed = 2.2; // Speed of the shape

int xdirection = 1; // Left or Right
int ydirection = 1; // Top to Bottom

void setup() 
{
  size(640, 360);
  noStroke();
  frameRate(30);
  ellipseMode(RADIUS);
  // Set the starting position of the shape
  xpos = width/2;
  ypos = height/2;
  rad=calculateBallSize(ypos);
}

void draw() 
{
  background(102);
  
  // Update the position of the shape
  xpos = xpos + ( xspeed * xdirection );
  ypos = ypos + ( yspeed * ydirection );
  rad=calculateBallSize(ypos);
  
  // Test to see if the shape exceeds the boundaries of the screen
  // If it does, reverse its direction by multiplying by -1
  if (xpos > width-rad || xpos < rad) {
    xdirection *= -1;
  }
  if (ypos > height-rad || ypos < rad) {
    ydirection *= -1;
  }

  // Draw the shape
  ellipse(xpos, ypos, rad, rad);
}

float calculateBallSize(float ypos){
   return map(mouseY,0,height,MINSIZE,MAXSIZE);
}

```