谷歌幾何計算器如何工作

Question

我最近看到了谷歌內置的幾何計算器。當我搜索任何其他形狀的「圓形區域」時，Google有一個內置的計算器，用戶可以在其中填充半徑並提供該區域。所以當用戶輸入一個值時，計算器會自動提供該區域，而無需用戶點擊提交按鈕，當用戶更改半徑時，計算器會自動重新計算該區域。
（檢查example，如果你想測試）

那麼它是怎樣工作的？它只是簡單的JavaScript或AJAX或其他網絡技術？ 在此先感謝

Answer 1

它只是一個數學計算，可以單獨使用JavaScript來完成。我猜想沒有必要使用AJAX。即使使用畫布，您也可以獲得輸入並計算並使用繪圖進行顯示。

你需要的是公式中的鏈接，你需要爲A = π * (r * r)圈

和廣場A = a * a其中a是一個邊長。

使用keyup回調函數，你可以很容易地做到這一點，而無需使用按鈕。見一個例子here

HTML

<input type="text" id="radius" /> 
<div id="res"> Area is <span> 0 </span> </div> 

jQuery的

$(document).ready(function() { 
    $("#radius").keyup(function(e) { 
     e.preventDefault(); 
     var r = parseInt($(this).val(),10); 
     var a = (r*r) * 3.142; 
     $("#res span").html(a); 
    }); 
}); 

的JavaScript

var rad = document.getElementById("radius"); 
rad.addEventListener("keyup", function() { 
    var r = parseInt(this.value, 10); 
    var a = (r*r) * 3.142; 
    alert(a);// display it in a element instead of alert 
}, false);