使用Raphael JS拖放SVG

时间:2012-01-20 12:47:13

标签: javascript svg drag-and-drop raphael

使用RaphaelJS寻找一些关于拖放SVG的建议(例如很棒)。

我找到了如何拖动使用Raphael

创建的对象
window.onload = function() {
var R = Raphael("canvas", 500, 500);    
var c = R.circle(100, 100, 50).attr({
    fill: "hsb(.8, 1, 1)",
    stroke: "none",
    opacity: .5
});
var start = function () {
...
},
move = function (dx, dy) {
...
},
up = function () {
...
};
c.drag(move, start, up);    
};​

但是我需要能够调整它以使用单独的SVG文件,例如 myPage.html有myImage.svg,我需要能够在'canvas'周围拖动myImage.svg。 我在想像

var c = R.SOMEMETHOD('myImage.svg');
...
c.drag(move, start, up);

例如。

有没有办法做到这一点,如果是这样,一个例子将是辉煌的!

1 个答案:

答案 0 :(得分:0)

RaphaelJS中不存在这种神奇的方法。但有一种方法可以实现这一目标。您可以查看适用于基本svgs

the raphael-svg-import project on GitHub

然后,您将需要使用grouping facility,因为您无法使用RaphaelJS的Set functionnality

1 - import your SVG
2 - As you import, mark the elements so they belong to the same group

享受!!