Jquery拖放并捕捉到kineticJS中的网格

嘿，我正在使用Kineticjs实现拖放操作 现在，如果图像靠近，我希望它们彼此捕捉。。 我在KineticJs中看到了海滩上的动物示例，这对我的功能没有帮助 然后看到了jquery捕捉到网格的东西..但是如果我使用它，那么我将不得不摆脱KineticJs。有没有办法实现jquery捕捉到KineticJs中元素的属性 因为在jquery中，他们已经传递了img的id，使其可拖动，然后捕捉。 那么，如何将其用于我的kinetic.js图像呢

jquery可拖动：

kinetic.js：

谢谢

---

Ashish

如果您想要捕捉到nxm网格的内容，那么您需要添加一个侦听器来调用捕捉它的函数。你可能想在“dragend”做这个

。。。100x100方砖网格

  function snaptogrid(YourObject){
     YourObject.x = Math.floor(YourObject.x/100) * 100 + 50;
     YourObject.y = Math.floor(YourObject.y/100) * 100 + 50;
  }

例：如果你的object.x=325，那么你将得到Math.floor（3.25）*100+50=350。左侧和顶部都应为300，而中心应为350

编辑，oops遗漏了问题的一部分。对于捕捉到其他方块，我会这样做：

function snaptoOther(YourSquares, index){
   var lastone = YourSquares.length-1;
   var maxDist = 125;
   var minDist = 75;
   var squarelength = 100;

   for(var i=0; i<lastone; i++)
   {
     var checkx = abs(YourSquares[index].x - YourSquares[i].x);
     var checky = abs(YourSquares[index].y - YourSquares[i].y);
     var multiplyX = Math.round((YourSquares[index].x - YourSquares[i].x)/squarelength);
     var multiplyY = Math.round((YourSquares[index].y - YourSquares[i].y)/squarelength);

      if(checkx < maxDist && checkx > minDist && i !== index)
        {
          YourSquares[index].x = YourSquares[i].x + multiplyX*squarelength;
        }
      if(checky < maxDist && checky > minDist && i !== index)
        {
          YourSquares[index].y = YourSquares[i].y + multiplyY*squarelength;
        }
   }
}

功能卡齿器（方格，索引）{
var lastone=YourSquares.length-1；
var-maxDist=125；
var minDist=75；
var平方长度=100；
for（变量i=0；i mindsist&&i！==索引）
{
你的方格[index].x=你的方格[i].x+乘以x*平方长度；
}
if（checkyminDist&&i！==索引）
{
YourSquares[index].y=YourSquares[i].y+multiplyY*squareslength；
}
}
}

如果您想要捕捉到nxm网格的内容，您需要添加一个侦听器来调用捕捉它的函数。你可能想在“dragend”做这个

。。。100x100方砖网格

  function snaptogrid(YourObject){
     YourObject.x = Math.floor(YourObject.x/100) * 100 + 50;
     YourObject.y = Math.floor(YourObject.y/100) * 100 + 50;
  }

例：如果你的object.x=325，那么你将得到Math.floor（3.25）*100+50=350。左侧和顶部都应为300，而中心应为350

编辑，oops遗漏了问题的一部分。对于捕捉到其他方块，我会这样做：

function snaptoOther(YourSquares, index){
   var lastone = YourSquares.length-1;
   var maxDist = 125;
   var minDist = 75;
   var squarelength = 100;

   for(var i=0; i<lastone; i++)
   {
     var checkx = abs(YourSquares[index].x - YourSquares[i].x);
     var checky = abs(YourSquares[index].y - YourSquares[i].y);
     var multiplyX = Math.round((YourSquares[index].x - YourSquares[i].x)/squarelength);
     var multiplyY = Math.round((YourSquares[index].y - YourSquares[i].y)/squarelength);

      if(checkx < maxDist && checkx > minDist && i !== index)
        {
          YourSquares[index].x = YourSquares[i].x + multiplyX*squarelength;
        }
      if(checky < maxDist && checky > minDist && i !== index)
        {
          YourSquares[index].y = YourSquares[i].y + multiplyY*squarelength;
        }
   }
}

功能卡齿器（方格，索引）{
var lastone=YourSquares.length-1；
var-maxDist=125；
var minDist=75；
var平方长度=100；
for（变量i=0；i mindsist&&i！==索引）
{
你的方格[index].x=你的方格[i].x+乘以x*平方长度；
}
if（checkyminDist&&i！==索引）
{
YourSquares[index].y=YourSquares[i].y+multiplyY*squareslength；
}
}
}

我首先创建网格

    var grid = new Array(gridSize);
    for (var row = 0; row < gridSize; row++) {
      grid[row] = new Array(gridSize);// the columns
    }

---

我首先创建网格

    var grid = new Array(gridSize);
    for (var row = 0; row < gridSize; row++) {
      grid[row] = new Array(gridSize);// the columns
    }

---

谢谢你的帮助我知道了很高兴听到这个消息。我是KineticJS的忠实支持者，很高兴看到您正在使用它。我鼓励你在KineticJS论坛上发布分享你的创作。我完成后一定会这样做。。非常感谢。。谢谢你的帮助。。收到。：）很高兴听到。我是KineticJS的忠实支持者，很高兴看到您正在使用它。我鼓励你在KineticJS论坛上发布你的作品。我一完成就一定会这样做。非常感谢：）