raphael將物體從一個容器拖放到另一個容器

我已經能夠在同一紙張內拖放元素。現在我需要能夠將拉斐爾元素從一個紙容器拖放到另一個紙容器。這裏是例如：從第一SVGraphael將物體從一個容器拖放到另一個容器

拖動到第二SVG

在HTML第一svg元素

<svg style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);" xmlns="http://www.w3.org/2000/svg" version="1.1" width="500" height="260"> 
 
    <rect style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);" x="10" y="15" width="64" height="64" r="5" rx="5" ry="5" fill="#ffc0cb" stroke="#000"> 
 
    </rect> 
 
</svg>

在HTML第二svg元素

<svg style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);" </svg>

首先，有可能嗎？如果可能的話，請給我一些線索如何去做。謝謝！

來源

2013-03-04 ryo

你是如何在同一篇論文中拖動的？ – Xymostech 2013-03-04 23:00:18

只需使用raphaeljs拖動處理程序。 – ryo 2013-03-05 03:12:23

你解決了嗎？ :) – chemitaxis 2014-06-04 06:43:25

幾天後，我用簡單的javascript和svg爲用戶提供了「拖放」功能。其中我給了一個函數來確定鼠標指針的確切位置，而不管是平移還是縮放。看看它，看看它是否對你有用。（我不知道它是如何在rapheal中工作的）

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}; 
      }

來源

2015-04-12 08:41:01

raphael將物體從一個容器拖放到另一個容器

回答

相關問題