使用RapaelJS放大/缩小逻辑

Question

因此，当您将flash对象设置为100％宽度/高度时，最终发生的事情是当您将其拉伸并使窗口变大时，Flash影片会放大。好吧也许这不是正在发生的事情，但看起来就是这样。

我正在尝试与RaphaelJS达成类似的目标。这里：http://jsfiddle.net/soparrissays/2rqtL/3/，我有一个简单的例子，当你使结果窗口更大时，圆缩小和扩展;然而，它倒退了。随着窗口尺寸的增大而不是变小，圆圈应该变大。谁能发现这里发生了什么？

我正在尝试使用setViewBox来实现这一目标。

Answer 1

我不知道我是否完全正确，但有一个解决方案如下。

我所做的是，我将最大化窗口innerwidth视为centPercentWidth。

然后onresize窗口，我发现当前窗口宽度将给出最大化窗口宽度的次数。这是通过

完成的。

var times = centPercentWidth/width;。

之后我有一个变量adjust，用于调整效果的夸张。 您可以更改此值，并查看调整大小效果如何因值而异。现在是它的一个（默认行为）。

然后我们使用times varible（c和d）找到viewBox的thrid和第四个参数的值。

摆放一个小提琴。 http://jsfiddle.net/89Qsx/

尝试调整小提琴的中位数。

Answer 2

viewBox是您可以看到的区域。您不希望这种情况发生变化 - 您希望无论规模如何都能看到原始的800 * 600区域。如果我的画布是800 * 600，我总是希望看到这个空间。我想要做的是缩放800 * 600区域以适应可见区域。您可以通过调整画布大小以适应窗口并将viewBox设置为静态800 x 600来实现此目的。

见：http://jsfiddle.net/WgTuF/1/