The d3.continuous.invert() function in D3.js is used to return the corresponding value from the domain if a value from the range is given.
Syntax:
.invert( Value )
Parameters: This function accepts single parameter Value which holds the value of range.
Return Value: This function returns the corresponding value from the domain if a value from the range is given.
Below programs illustrate the d3.continuous.invert() function in D3.js:
Example 1:
<!DOCTYPE html> <html>   <head>     <title>         D3.js | d3.continuous.invert() Function     </title>           <script src =     </script> </head>   <body>     <script>                   // Calling scaleLinear() function         var x = d3.scaleLinear().domain([10, 150])                     .range([0, 1000]);           // Calling the .invert() function         // and getting the corresponding value         // from domain if value from range is given         console.log(x.invert(150));         console.log(x.invert(999));     </script> </body>   </html> |
Output:
31 149.86
Example 2:
<!DOCTYPE html> <html>   <head>     <title>         D3.js | d3.continuous.invert() Function     </title>           <script src =     </script> </head>   <body>     <script>                   // Calling scaleLinear() function         var x = d3.scaleLinear().domain([0, 1])                 .range([10, 20]);           // Calling the .invert() function         // and getting the corresponding value         // from domain if value from range is given         console.log(x.invert(11));         console.log(x.invert(13));         console.log(x.invert(15));         console.log(x.invert(19));               </script> </body> </html>    |
Output:
0.1 0.3 0.5 0.9
Reference: https://devdocs.io/d3~5/d3-scale#continuous_invert