垂直拉伸圖形

Question

這是sandbox（http://jsfiddle.net/qeyqe/）。
這是我期望說的一個美麗的picture「垂直拉伸圖」。

所以，我爲我的圖形和100像素高度的畫布創建了一個點陣。我的圖形的最大值和最小值分別是84（0.8425）和44（0.439） - 因此，圖形的高度範圍是40像素（84 - 44）。但是我需要拉伸這張圖，所以它需要整個100像素的高度範圍 - 我需要將值「84」轉換爲100，並將值「44」轉換爲0;其他中間值也需要進行轉換（拉伸）以適應新的0-100像素範圍，而不是老的0-40像素（見上圖）。

所以，主要的問題不是如何「縮放」圖形，而是如何垂直「伸展」。

Answer 1

您可以直接在你的代碼通過更換線

value = Math.round(ratesValues[i] * 100); 

與以下行拉伸值：

min = 0.439; 
max = 0.8425; 

value = Math.round((ratesValues[i]-min)/(max-min)*100); 

您可以更改號碼0.439和0.8425，以反映實際的最小和最大的圖形。