Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

91
Views
Is there a way to set a maximum area on a random rectangle in Paper.js?

I'm trying to place a randomly sized rectangle in the center of 1200x1200 canvas, with a min size of 200x200 and a max size of 900x900. However, I would also like to set a maximum area (of half the 900x900 maximum space) on the rectangle to prevent it from ever being one giant square. Basically, I want to create large random rectangles, or squares of a similar area, but never huge squares. I have the random rectangle part working, but not sure on how to limit the overall area.

var maxSize = new Size(700, 700);              // max size of 900x900 when combined with +200 below
var randomSize = Size.random();                // random number between 0 and 1
var size = (maxSize * randomSize) + 200;       // effectively creates a 200x200 minimum size, max 900x400

var box = new Rectangle(new Point(0,0), size); // creates rectangle at 0,0 with size
box.center = (600, 600);                       // centers rectangle at 600,600
var path = new Path.Rectangle(box);            // draws rectangle on screen
    path.fillColor = '#cccccc';
about 4 years ago · Juan Pablo Isaza
2 answers
Answer question

0

You have two constraints, your max size and area...
I'm assuming that we need to meet both, we will need to get the minimum between those

The area of a rectangle is equal to the product of its length and width
With a given area we can get a max side as a square of the area = Math.sqrt(max_area)

Integrating that to your code:

  const max_area = 788544
  var max_side = Math.sqrt(max_area) - 200
  var maxSize = new Size(Math.min(700, max_side), Math.min(700, max_side));
  ...
about 4 years ago · Juan Pablo Isaza Report

0

Based on the answer above, I ended up generating random width and height, then checking the height against a max_height extrapolated from area and width. There's probably a way to streamline it, but it seems to work okay. Thank you!

// Get random integer between two values, inclusive
function getRandomLength(min, max) {
    min = Math.ceil(min);
    max = Math.floor(max);
    return Math.floor(Math.random() * (max - min + 1) + min);
}

var max_area = 260000;
var width = getRandomLength(200,900);
var random_height = getRandomLength(200,900);
var max_height = max_area / width;
var height = Math.min(random_height, max_height);

var size = new Size(width, height);

var box = new Rectangle(new Point(0,0), size); 
box.center = (600, 600); // centers rectangle at 600,600
var boxPath = new Path.Rectangle(box);
boxPath.fillColor = '#cccccc';

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!