D3.js pow.clamp() Function
Last Updated :
28 Sep, 2021
The pow.clamp() function in d3.js is used to enable the clamp or disable the clamp only if the clamp is specified. The range of the return value may be outside the given range if the clamp is disabled.
Syntax:
pow.clamp(clamp);
Property Values: This function accepts single parameter as given above and described below.
- clamp: It accepts a boolean value of true or false.
Below given are a few examples of the function given above.
Example1: When clamp is set to false.
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport"
path1tent="width=device-width,
initial-scale=1.0"/>
<script src=
</script>
<script src=
</script>
<script src=
</script>
<script src=
</script>
</head>
<body>
<h2 style="color: green;">
Geeks for geeks
</h2>
<p>pow.clamp() Function </p>
<script>
// Calling the .scalePow() function
var x = d3.scalePow()
.domain([10, 100])
.range([0, 5])
.clamp(false);
// Calling pow() and .invert() function
var a = x(2);
var b = x.invert(15);
document.write("<h3>"+a+"</h3>");
document.write("<h3>"+b+"</h3>");
</script>
</script>
</body>
</html>
|
Output:
Example 2: When clamp is set to true.
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport"
path1tent="width=device-width,
initial-scale=1.0"/>
<script src=
</script>
<script src=
</script>
<script src=
</script>
<script src=
</script>
</head>
<body>
<h2 style="color:green;">Geeks for geeks</h2>
<p>pow.clamp() Function </p>
<script>
// Calling the .scalePow() function
var x = d3.scalePow()
.domain([10, 100])
.range([0, 5])
.clamp(true);
// Calling pow() and .invert() function
var a = x(12);
var b = x.invert(15);
var c = x.invert(150);
document.write("<h3>"+a+"</h3>");
document.write("<h3>"+b+"</h3>");
document.write("<h3>"+c+"</h3>");
</script>
</script>
</body>
</html>
|
Output:
Share your thoughts in the comments
Please Login to comment...