0

我想更改 Raphael 的纸张（对象基础）大小以适应窗口大小调整。[使用 Firefox_13.0、Raphael_2.1.0、WindowsXP]

如果可用，我想适合全屏模式。

====================================================

（脚步）

我创建了论文：paper = Raphael(0, 50, 800, 600); // 初始宽度和高度分别为 800 和 600。

我把物品放在纸上。

浏览器的窗口大小由 windowW = window.innerWidth 和 winnowH = window.innerHeight （在 Firefox 上）检查。

缩放值由 sv = windowW/800 计算；

并通过 paper.scale(sv, sv); 缩放纸张

====================================================

（剧本）

window.onload = 函数（）{

paper = Raphael(0, 50, 800, 600);   
var background = paper.rect(0, 0, 800, 600).attr({fill:'#669999'});

// placing the objects
var circle = ...;
var rect = ...;
var ellipse = ...;

winowW = window.innerWidth;
winowH = window.innerHeight;
sv = winowW/800.

paper.scale(sv, sv);

}

====================================================

（结果）

虽然 circle.scale(sv)、rect.scale(sv, sv) 和 ellipse.scale(sv, sv) 有效，但 paper.scale(sv, sv) 和 background.scale(sv, sv) 无效。

为什么会发生这种情况？我可以通过 window.onresize = function() {...} 实时获取窗口大小。如果有更好的方法，请告诉我。

谢谢，

4

2 回答 2

0

我通过以下两点成功：

1）“纸”本身不是操纵对象。我认为我们应该将其视为广告牌。

2）使用 st = paper.set() 并将对象（圆形，矩形，...）放入其中。并使用 st.scale(sv, sv, 0, 0);

*第三个和第四个参数(0, 0) 很无能。

（警告）

串行调整大小操作不适用于函数“scale()”。因为每个调整大小的系数都堆积成一个数字的幂。因此，当一个人做了 5 次 1.1 次调整大小操作时，比例将为 1.1^5。

于 2012-06-10T19:07:44.883 回答
0

使用 setViewBox()

它应该做的工作 http://raphaeljs.com/reference.html#Paper.setViewBox

于 2014-07-04T07:28:22.153 回答