Javascript 在raphael纸张中拖放dom元素

我正在svg中工作，并使用Raphael js在svg中创建动态对象。现在我想知道是否可以将一些预定义的形状从html列表拖放到svg

详情如下:

我有一些预定义的形状存储在侧栏中列出的数据库表中。每个形状都有自己的json字符串，这是我使用Raphaël.json（）完成的

另一方面，我有一个拉斐尔生成的svg

现在，我想将每个预定义的形状拖动到raphael svg/纸上。（我已经完成了拖动，使用jquery ui拖动非常容易）。在删除列表之后，我想呈现获取json字符串的对象（我已经完成了）

但问题是我找不到拉斐尔论文的确切落点。我也在使用panZoom进行缩放和平移。我希望在放大和缩小纸张时保持一致性

屏幕截图：

拖动的对象是图像，而不是svg

---

我将感谢您的帮助和提前感谢。

几天后，我向用户提供了一个“拖放”功能，使用简单的javascript和svg。在其中，我给出了一个函数，该函数可以确定鼠标指针的精确位置，而不考虑平移或缩放。看看它是否对你有用。 （我不知道用拉斐尔语怎么说）

---

谢谢Rehan，我将查看此解决方案。

 var mainsvg = document.getElementsByTagName('svg')[0];
 function mouseup(event) {
        var svgXY = getSvgCordinates(event);// get current x,y w.r.t to your svg.
    }
        function getSvgCordinates(event) {
                    var m = mainsvg.getScreenCTM();
                    var p = mainsvg.createSVGPoint();
                    var x, y;

                    x = event.pageX;
                    y = event.pageY;

                    p.x = x;
                    p.y = y;
                    p = p.matrixTransform(m.inverse());

                    x = p.x;
                    y = p.y;

                    x = parseFloat(x.toFixed(3));
                    y = parseFloat(y.toFixed(3));

                    return {x: x, y: y};
                }