d3.js quantize()用法及代碼示例

d3.quantize函數用於生成均勻分布的插值樣本並返回它們。在從給定的內插器生成特定數量的樣本時很有用。

用法:

d3.quantize(interpolator, n);

參數：它采用以下兩個參數。

interpolator:它是插值器函數。
n:它是給定內插器所需的樣本數

返回值：它返回數組。

範例1：

HTML

<!DOCTYPE html> 
<html lang="en"> 
  
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content= 
        "width=device-width,initial-scale=1.0"> 
    
      <!--Fetching from CDN of D3.js -->
    <script type="text/javascript" 
        src="https://d3js.org/d3.v4.min.js"> 
    </script> 
</head> 
  
<body> 
      
    <script> 
        let interpolator = 
            d3.interpolate("blue", "white"); 
        // Creating four samples  
        let samples = d3.quantize(interpolator, 4); 
        console.log(samples) 
    </script> 
</body> 
  
</html>

輸出：

範例2：

HTML

<!DOCTYPE html> 
<html lang="en"> 
  
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content= 
        "width=device-width,initial-scale=1.0"> 
  
    <!--Fetching from CDN of D3.js -->
    <script type="text/javascript" 
        src="https://d3js.org/d3.v4.min.js"> 
    </script> 
</head> 
  
<body> 
    <div class="b1"></div> 
    <div class="b2"></div> 
  
    <script> 
        let interpolator = 
            d3.interpolate("blue", "white"); 
        let samples = d3.quantize(interpolator, 4); 
        console.log(samples) 
  
        // Using interpolateCubehelix 
        interpolator = 
            d3.interpolateCubehelix("blue", "white"); 
        samples = d3.quantize(interpolator, 3); 
        console.log(samples) 
          
        // Using interpolateRound 
        interpolator = 
            d3.interpolateRound((0, 1e3), 10); 
        samples = d3.quantize(interpolator, 3); 
        console.log(samples) 
    </script> 
</body> 
  
</html>

輸出：

相關用法

注：本文由純淨天空篩選整理自tarun007大神的英文原創作品 D3.js quantize() Function。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。