Fabric.js limitDimsByArea() Method
Last Updated :
10 Mar, 2021
The limitDimsByArea() method is used to return the max width and height that can respect the total allowed area for specified aspect ratios. Aspect ratio describes the ratio between the width and height of an image or screen or area. For example, A 1:1 aspect ratio, is a square. The first number always refers to the width, and the second one refers to the height. In this function, aspect ratio described as a single number – in this case, the number refers to the width where the height is 1.
Syntax:
limitDimsByArea(ar, maximumArea)
Parameters: This method accepts two parameters as mentioned above and described below:
- ar: This parameter holds the specified aspect ratio.
- maximumArea: This parameter holds the allowed area.
Return Value: This method returns the limited dimensions by width(x) and height(y).
Example 1:
Javascript
<!DOCTYPE html>
<html>
<head>
<!-- Adding the FabricJS library -->
<script src=
</script>
</head>
<body>
<script type="text/javascript">
console.log(fabric.util.limitDimsByArea(1, 5));
console.log(fabric.util.limitDimsByArea(2, 20));
console.log(fabric.util.limitDimsByArea(5, 45));
console.log(fabric.util.limitDimsByArea(10, 500));
</script>
</body>
</html>
|
Output:
{"x":2,"y":2}
{"x":6,"y":3}
{"x":15,"y":3}
{"x":70,"y":7}
Example 2:
Javascript
<!DOCTYPE html>
<html>
<head>
<!-- Adding the FabricJS library -->
<script src=
</script>
</head>
<body>
<script type="text/javascript">
var ar1 = 4;
var ar2 = 6;
var area1 = 50;
var area2 = 100;
console.log(fabric.util.limitDimsByArea(ar1, area1));
console.log(fabric.util.limitDimsByArea(ar2, area2));
</script>
</body>
</html>
|
Output:
{"x":14,"y":3}
{"x":24,"y":4}
Share your thoughts in the comments
Please Login to comment...