将SVG拖放到Raphael上?

时间:2012-11-28 22:46:42

标签: html5 svg raphael

我即将开始一个新项目,该项目涉及将工具箱中的对象(最好是SVG)拖放到舞台上,我正在考虑使用Raphael.js来帮助。

我遇到的问题是,我希望应用UI具有以HTML格式创建的布局,包括可滚动面板(包括工具箱)。然后,我希望用户能够从工具箱中组合并将其拖到“舞台”上。

我认为我的选择是双重的:

1)在Raphael中创建整个UI作为SVG。我猜想在拉斐尔创建一个包含可滚动面板的UI将比使用纯HTML更难,这会给我带有溢出的Flexbox和DIV:auto等。

2)用HTML创建UI,然后以某种方式将SVG组件从工具箱拖放到Raphael舞台上,然后我可以让用户将它们放到适当的位置。我不确定这是否可能。

我的断言是否正确?如果是这样,是否可以检测用户何时在舞台上移动并以某种方式隐藏拖动帮助并在舞台内重新创建组件?

1 个答案:

答案 0 :(得分:0)

我不久前写过类似的东西。我将工具箱中的组件绘制为单独的Raphael画布。拖动时,我将此工具移出工作区域。当被删除时,我进行计算以找出位置,然后在该位置的工作区域中创建一个新的Raphael对象。然后将拖动的对象放回工具箱中的适当位置。这适用于您的情况吗?