User interface 使用Raphael.js绘制ui元素

知道大量使用raphaeljs制作ui元素的例子吗 对于web应用程序。表单容器/窗口、选项卡控件等。任何 执行此操作时的建议（如缓存生成的svg/rvml以用于

---

重用？

我正在为一个商业智能应用程序做一些类似的工作。我有一个controller/factory类，它在每个仪表板级别而不是小部件级别缓存生成的svg/vml。实际上，它没有什么神奇之处，只是使用raiseDash/lowerDash方法检查指定的仪表板是否存在，如果不存在，则创建它，并隐藏上一个仪表板

如果您甚至认为您可能想要逻辑地将一些元素组合在一起，那么为它们创建一个集合。起初我担心性能会受到影响，但如果你看看g.raphael的源代码，即使是raphael的开发人员也会使用很多

---

我创建的每个仪表都有一个背景集和一个前景集（由刻度盘、指示器和文本组成），它们都被合并到其父窗口小部件的前景集中，而父窗口小部件又被合并到整个仪表板的前景集中。这样，我可以隐藏整个仪表板，并通过两个方法调用显示另一个仪表板，同时在仪表板对象中保留细粒度控制。选项卡式界面的工作方式大致相同。

一个简单的例子是使用Raphael生成的图标

看看“拉斐尔先生”自己创作的。它们提供了非常好的可伸缩性，就像使用SVG完成的所有其他UI小部件一样

使用的最重要的方法之一是，因此您可以将处理程序附加到关联的元素。使用

.node（）

可以很容易地让Raphael与其他一些更适合用户界面的库进行交互

拉斐尔现在甚至有一些内置的