Question

我有一个尺寸为w和h的文件。里面有一个尺寸为w1和h1的矩形，位于坐标x和y中。

要计算x和y，使矩形始终在我使用的文档中居中：

x = (w / 2) - (w1 / 2)
y = (h / 2) - (h1 / 2)

它有效！

但我还想动态改变w1和h1，这总是与w和h成比例。例如，如果文档小于矩形，则矩形应缩小其比例，同时按比例缩小。

那么，我该如何计算w1和h1？

“document”是html5画布，矩形是图像。我在javascript工作。

谢谢！

这是一个JS小提琴：http://jsfiddle.net/Saturnix/TkPX5/1/ 尝试缩放窗口：矩形始终保持在中心。但是如果窗口变小，它就不会调整大小。我想念计算w1和h1的公式。

Answer 1

我编写了以下代码，可以实现您想要的并且基于您在评论中提供的jsfiddle：

var w1 = 300;
var h1 = 400;
var WPROP = w1/g.width;
var PROP = h1/w1;
g.draw = function() {       
    // DOCUMENT WIDTH AND HEIGHT
    var w = g.width;
    var h = g.height;            

    w1 = WPROP*w;
    h1 = PROP*w1;

    // RECTANGLE
    var x =  (w / 2) - (w1 / 2);
    var y = (h / 2) - (h1 / 2);

    g.ctx.fillRect(x,y,w1,h1);

}

有关此代码的工作，请参阅here。

计算调整大小比例

1 个答案: