javascript - Raphael.js 和文档高度

Question

我创建了一个画布

var paper = Raphael(domid);
...
paper.height = 600;
paper.width = 600;

在我绘制路径之后，它的一部分是不可见的（因为它超出了画布的边缘）。但如果我这样做

var paper = Raphael(domid, 600, 600);

一切都好。第二段和第一段代码之间的本质区别是什么？

Answer 1

Rapheal 在 Paper 对象上没有设置器width，height因此调用它们不会影响 DOM，而只是在 Paper 对象上设置一些属性。

在构造函数中传入width和height参数会影响 DOM 中的 SVG 标签。

如果你想在构建后改变纸张的宽度和高度，你可以像这样设置 SVG 标签的样式属性：

var paper = Raphael(domid);
paper.canvas.style.width = '200px';
paper.canvas.style.height = '100px';

正如 Kevin 所提到的，使用该setSize方法来处理运行时调整大小可能会更好。

例如）

paper.setSize(200,100)

希望有帮助。

Answer 2

可能还有另一种解决方案：var paper = Raphael(domid, '100%', '100%');.